0

I am a newbie on IONIC, angularJS and Django. I tried to host a IONIC project in Django. Django and angularJS are all great framework, but when they get together, it makes me confused.

Q1. How to combine Django URLS and angularJS router? These two mechanism are all used for URL router, should I get ride of angularJS router?

for example:

URLS.py:

urlpatterns = [
    url('^login$', views.login),
    url('^jobDetail$', views.jobDetail),
]

view.py

def jobDetail(request):
    context = RequestContext(request)
    return render_to_response('we/JobDetail.html', {}, context)

def login(request):
    context = RequestContext(request)
    return render_to_response('we/login.html', {}, context)

Yeah, I have get ride of Angular router, and every URL is routed by Django. I think Angular router should be able to work with Django URLs.

   angular.module("test", [])
    .config(function($stateProvider, $urlRouterProvider) {
      $stateProvider

      .state('myJobs', {
        url: "/myJobs",
        templateUrl: "myJobs.html",
        controller: 'myJobsCtl'
      })

    });

Is there anyone who can provide a sample which can show me how Django urls and angularJS router work together?

Q2, how to assign Django variable to AngularJS?

For example, I have a "test" page. When this page is requested by web browser, the view query a case_list from the DB, and then return the page after rendering the Django template. case state can change after some actions, so it should be a angular variable. (use verbatim to prevent {{case.state}} rendered by Django) Here comes the question. How can I assign Django variable case_list to angularJS controller so that angularJS can render {{case.state}} in front side?

The following thread provides a method which leverages global variable. I haven't tried it, but I think it is not a good idea.

Assign Django variable value to AngularJS

view.py

def test(request):
    context = RequestContext(request)
    server_data = {
        'case_list': InstallFlow.get_list_by_user(request.user)
    }
    return test_render_to_response(request, 'wechat/myJobs.html', {}, server_data)

test.html:

  <div ng-controller="myJobsCtrl">
      {% for case in case_list %}
        <label class="item item-input">
             <span class="input-label">status</span>
             <span>{{case.name}}</span>

             <span class="input-label">status</span>
            {% verbatim %}
            <span>{{case.state}}</span>
            {% endverbatim %}

        </label>
      {% endfor %}
    </div>

1 Answer 1

0

Since you're doing an Ionic project, it's best to use AngularJS on the Frontend and let Django handle the backend. Use AngularJS Routes to render your views and use Django Routes to create your backend API on your server that communicates to your database and outputs JSON. You can then use AngularJS's $http to communicate to your API.

http://www.django-rest-framework.org/

https://docs.angularjs.org/api/ng/service/$http

Sign up to request clarification or add additional context in comments.

1 Comment

I need to create a website for mobile web browser, not app.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.