Использование URL-адресов Django с помощью метода AngularJs routeProvider
для проекта, я использую Django на back-end и AngularJs на передней панели.
В принципе, я хочу запустить приложение Angular только тогда, когда URL-адрес начинается с projectkeeper/
.
Другими словами, скажем, мой сайт example.com. Я хочу, чтобы приложение Angular запускалось для URL-адресов example.com/projectkeeper/dashboard/
, example.com/projectkeeper/projects/
и т.д., Но не на example.com/about/
.
Надеюсь, я поняла. Во всяком случае, для этого я делаю следующее с моим кодом:
urls.py
urlpatterns = [
url(r'^projectkeeper/$', TemplateView.as_view(template_name='base.html')),
]
В шаблоне base.html я, очевидно, ссылаюсь на свое приложение Angular. Для маршрутизации Angular я сделал следующее:
myapp.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/dashboard/', {
title: 'Dashboard',
controller : 'DashboardController',
templateUrl : 'static/app_partials/projectkeeper/dashboard.html'
})
.otherwise({ redirectTo : '/' });
}]);
Итак, в идеале, я думал, что переход на example.com/projectkeeper/#/dashboard/
будет запускать DashboardController из моего приложения Angular. Однако это не так, я получаю только пустую страницу, что означает, что маршрутизация была неправильной.
Какие-нибудь решения? Как я уже говорил, я хочу запустить Angular приложение только, когда URL начинается с projectkeeper/
.
Ответы
Ответ 1
Я думаю, что вы довольно близки, есть немного вещей, чтобы сделать это (честно говоря, это путать, чтобы понять, и я надеюсь, что ничего не забыл).
Во-первых, ваш порядок URL-адресов важен, если вы определите что-то перед маршрутами angular, которые они будут отображаться первыми, поэтому используйте URL-адрес приложения django до angular.
Затем, если вы хотите, чтобы angular знал о подпути, вам нужно определить тег <base>
в заголовке. В вашем случае:
<base href="/projectkeeper/" />
(вы также можете определить projectkeeper
его во всех ваших where
функциях tho).
Для URL-адресов я бы изменил регулярное выражение на: r'^projectkeeper/.*'
. Опять же, он должен быть последним в списке ваших URL.
У вас появятся другие проблемы, такие как проблемы с проверкой {{ }}
, но они останутся для другого ответа:)
Ответ 2
Попробуйте этот ui-маршрутизатор для angularJS
https://github.com/angular-ui/ui-router
Это будет более полезно для вложенных представлений и проблем, с которыми вы сталкиваетесь в настоящее время.