python - angular route 与 django urls 冲突怎么解决？

Question

app.js

var app = angular.module('app', [
    'ngResource',
    'ngRoute',
    // 'ui.bootstrap',
    // 'ngResource',
    'student',
]);

app.config(
        function(
          $locationProvider,
          $routeProvider
          ){
          $locationProvider.html5Mode({
              enabled:true
            })
          $routeProvider.
              when("/", {
                template: 'base',
              }).
              when("/student/1", {
                template: "<student-detail></student-detail>",
              }).
              otherwise({
                template: "Not Found"
              })

    });

student.js

var app = angular.module('student', []);

app.component('studentDetail',{
        templateUrl:'studentDetail.html',
        controller: function($scope) {
        $scope.test = 'Got it.'
        }
      });

urls.py

class SimpleStaticView(TemplateView):

    def get_template_names(self):
        return [self.kwargs.get('template_name') + ".html"]

urlpatterns = [
    url(r'^admin/', include(admin.site.urls)),
    url(r'^api/', include("students.api.urls", namespace='students-api')),

    url(r'^(?P<template_name>\w+)$', SimpleStaticView.as_view(), name='example'),
    url(r'^$', TemplateView.as_view(template_name='home.html')),
]
if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
    # urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

测试，当访问/，base字段是出现的，说明ng-view工作 正常，但当访问/students/1时，返回django路由报错，未找到该路由。

studentDetail.html是存在的。

这是angular没获取到路由请求吗？该如何解决？谢谢。

Answer 1

초대해주셔서 감사합니다. 이 글을 먼저 읽어보시길 권합니다 - 싱글 페이지 애플리케이션의 핵심

개발 및 디버깅 시 개발자 도구를 사용하여 템플릿 요청의 실제 경로를 확인할 수 있습니다. 또한 Django 라우팅 구성의 경우 템플릿 요청 주소를 일치시키고 템플릿 파일을 올바르게 반환하기만 하면 됩니다. Angular 1.x 프론트엔드 부분은 다음 예시를 참고하세요:

Angular 1.x 데모 프로젝트 디렉토리 구조

views/student.module.js

으아악

views/studentDetail.html

으아악

index.html

으아악

새 프로젝트에서는 Angular 1을 사용하는 것이 좋습니다. 구성 요소의 예는 다음과 같습니다.

으아악

자세한 내용은 구성요소 속성 바인딩-입력-각도-2를 참조하세요

또한 관심이 있거나 프로젝트가 허용하는 경우 최신 버전인 Angular 4.0.1 사용을 고려해 볼 수 있습니다

알림(질문은 건너뛰세요): 이 예제에서는 로컬 서버를 시작해야 합니다. Python이 설치된 경우 명령줄에서 python -m SimpleHTTPServer

를 실행할 수 있습니다.

참고자료

• Angularjs html5mode 모드 라우팅

• Angular Routing으로 제거된 URL의 # 숫자