Scribd Logo
Upload

Welcome to Scribd!

  • Artpython Doctor Page Django Angularjs Angular Js Coffee Script

    Uploaded by

    Bernard Gnazou
    0 views2 pages

    Original Title

    artpython_doctor_page_django_angularjs_angular_js_coffee_script

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    0 views2 pages

    Artpython Doctor Page Django Angularjs Angular Js Coffee Script

    Uploaded by

    Bernard Gnazou

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 2

    AngularJS et Django

    Crispy Forms
    Uploader un fichier en ajax

    Dans l'exemple suivant vous verrez comment éviter le conflit des accolades Django et AngularJS : {{variable}}
    Les paramètres indiqués vous permettent d'avoir une base pour travailler avec une base assez souple.

    app = angular.module 'app', ['ngRoute', 'ngResource', 'ui.select', 'ngSanitize', 'ui.bootstrap', 'ngFileUpload']

    app.config ($routeProvider, $interpolateProvider, $httpProvider, $resourceProvider) ->

    $httpProvider.interceptors.push 'httpInterceptor'
    $httpProvider.defaults.headers.common['X-CSRFToken'] = $.cookie('csrftoken')
    $httpProvider.defaults.xsrfCookieName = 'csrftoken';
    $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';

    $interpolateProvider.startSymbol '~{'
    $interpolateProvider.endSymbol '}~'

    $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

    $resourceProvider.defaults.stripTrailingSlashes = false

    $routeProvider
    .when '/dashboard', templateUrl: '/backoffice/dashboard', controller: 'DashboardController', title : 'Tableau de bord'
    .otherwise redirectTo: '/backoffice'
    return

    app.factory 'httpInterceptor', ['$q', '$rootScope', ($q, $rootScope) ->


    currentRequestsCount = 0
    return {
    request: (config) ->
    currentRequestsCount++
    return config || $q.when(config)
    ,
    response: (response) ->
    return response || $q.when(response)
    ,
    responseError: (response) ->
    return $q.reject response
    }
    ]

    Notre template HTML index:

    <!DOCTYPE HTML>
    <html ng-app="app">
    <head>
    <meta charset="utf-8">
    <title>{% block title %}Mon projet - {% endblock %}</title>
    <link rel="stylesheet" type="text/css" href="/static/css.css" />
    <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
    </head>
    <body>
    <div id="page" data-ng-view>
    {% block content %}Chargement...{% endblock %}
    </div>
    </body>
    <script src="/static/js.js"></script>
    </html>

    Créons maintenant notre controlleur AngularJS :

    class DashboardController

    @$inject: ['$scope']
    @products = []

    constructor: (@scope) ->


    @scope.name = 'Olivier ENGEL'
    @scope.products = @get_products()
    @scope.add_product = @add_product

    Convert web pages and HTML files to PDF in your applications with the Pdfcrowd HTML to PDF API Printed with Pdfcrowd.com
    get_products: =>
    products = []
    products.push {name: 'iPad 2015', price : 999.99}
    products.push {name: 'iPod 2000', price : 199.99}
    products

    add_product: =>
    @scope.products.push {name:'iMac', price: 1499.99}
    true

    app.controller 'DashboardController', DashboardController

    Et le template retour ajax:

    <p>Bonjour ~{name}~</p>
    <p>Les produits sélectionnés:</p>
    <ul>
    <li ng-repeat="product in products">~{product.name}~</li>
    </ul>
    <button ng-click="add_product()">Ajouter un produit</button>

    Configurons les urls

    urlpatterns = [
    # Views angularjs
    url(r'^erp/$', login_required(TemplateView.as_view(template_name='backoffice/index.html'))) ,
    url(r'^erp/dashboard$', login_required(TemplateView.as_view(template_name='backoffice/dashboard.html'))) ,
    ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

    Crispy Forms
    Uploader un fichier en ajax

    Convert web pages and HTML files to PDF in your applications with the Pdfcrowd HTML to PDF API Printed with Pdfcrowd.com

    You might also like