Let Django play well with AngularJS
How to run
git clone https://github.com/jrief/django-angular.git django-angular.git cd django-angular.git docker build -t django-angular.git . docker run -d -it -p 9002:9002 django-angular.git
Open the applcaiton at
To be compliant with other libraries such as djangorestframework, server-side responses on rejected forms use error code 422, rather than 200. If you use your own form controllers, adopt them accordingly. The JSON format used to communicate errors downstream has changed slightly.
For a smoother transition path, django-angular added two directives in version 2.0:
<form djng-endpoint="/path/to/endpoint">...</form>, which can be used to upload form
data to the server. It also populates the error fields, in case the server rejected some data.
<djng-forms-set endpoint="/path/to/endpoint"><form ...>...</form>...</djng-forms-set>
Similar to the above directive, but rather than validating one single form, it validates a
set of forms using one shared endpoint.
A promise chain has been introduced. Buttons used to submit form data and then proceed with something else, now can be written as:
Detailed documentation on ReadTheDocs.
Demo on how to combine Django with Angular's form validation.
Please drop me a line, if and where you use this project.
- Seamless integration of Django forms with AngularJS controllers.
- Client side form validation for Django forms using AngularJS.
- Manage Django URLs for static controller files.
- Three way data binding to connect AngularJS models with a server side message queue.
- Perform basic CRUD operations.
A next big change to django-angular should be to add support for Angular2/4/5. However, I'm still unsure about the future roadmap of the Angular, and I currently don't have the resources to do so.
- To be compliant with other frameworks, Ajax responses from invalid form submissions, now respond
HttpResponseBadRequest(status code 422) rather than with a
- No more need to add a customized controller for uploading form data to the server. Instead add the
djng-endpoint="/path/to/endpoint"to a form and submit the form's content using an action event.
- New AngularJS directive
djng-forms-set, usable to validate and submit more than one form.
- AngularJS directive for the
button-element, usable to create a chain of action promises for form submissions.
- Add support for AngularJS version 1.6 by replacing deprecated occurrences of
- Sekizai's postprocessor
module_configare deprecated and will be removed, since it is easier to fulfill the same result using Sekizai's templatetag
- Radio input fields do not require the DjNg directive
Copyright © 2018