AngularJS 路由器不加载在 `templateURL` 提供的页面
AngularJS router does not load page served at `templateURL`
这是我的 HTML 页面(访问路径 /
时得到服务):
<form ng-submit="ctrl.loginUser()" name="myLoginForm">
<div class="form-group">
<label>Username</label>
<input type="text" name="uname" class="form-control" ng-model="ctrl.loginuser.username" required>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" name="pwd" class="form-control" ng-model="ctrl.loginuser.password" required>
</div>
<input type="submit" value="Login">
</form>
<div ng-view></div>
这是提交表单时调用的内容:
angular.module("BaseApp", [])
.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.xsrfCookieName = 'csrftoken';
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
}])
.config(['$locationProvider', function($locationProvider){
$locationProvider.html5Mode(true);
}])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/home', {
templateURL: 'static/templates/mainPage.html'
})
/*
.otherwise({redirectTo: '/'});
*/
}])
self.loginUser = function(loginuser) {
return $http.post("/custom-api-auth/login", loginuser)
.then(function(response) {
$location.url("/home");
});
};
static/templates/mainPage.html
是这样的:
<html>
<head>
<base href="/" >
</head>
<h5>TESTTTTTTTT</h5>
我尝试对此进行测试并提交表单。 URL 更改为 /home
,但 TESTTTTTTTT
未显示。当我通过地址栏手动将静态 URL 更改为 /static/templates/mainPage.html
然后按回车键时,mainPage.html
实际上会出现。当我将 templateURL: 'static/templates/mainPage.html'
更改为 template: '<h5>This is the default route</h5>'
时,This is the default route
会正确显示。
为什么static/templates/mainPage.html
没有出现?
我正在使用 Django / DRF 作为我的后端,这是我的 urls.py
:
from django.conf.urls import url
from django.conf.urls import include
from ebdjangoapp import views
from rest_framework import routers
router = routers.DefaultRouter()
router.register(r'stuffs', views.StuffViewSet)
router.register(r'users', views.UserViewSet)
urlpatterns = [
url(r'^api/', include(router.urls)),
# templates
url(r'^$', views.HomePageView.as_view()),
url(r'^home$', views.MainPageView.as_view()),
# login logout
url(r'^custom-api-auth/login$', views.login_view.as_view()),
url(r'^custom-api-auth/logout$', views.logout_view.as_view()),
]
这是我的 views.py
:
class HomePageView(TemplateView):
def get(self, request, *args, **kwargs):
return TemplateResponse(request, "home.html")
class MainPageView(TemplateView):
def get(self, request, *args, **kwargs):
return TemplateResponse(request, "mainPage.html")
请注意,/home
服务于页面 mainPage.html
,而 /
服务于页面 home.html
(我知道这有点混乱)。
不是templateUrl,不是你$routeProvider代码中的templateURL吗?
这是我的 HTML 页面(访问路径 /
时得到服务):
<form ng-submit="ctrl.loginUser()" name="myLoginForm">
<div class="form-group">
<label>Username</label>
<input type="text" name="uname" class="form-control" ng-model="ctrl.loginuser.username" required>
</div>
<div class="form-group">
<label>Password</label>
<input type="password" name="pwd" class="form-control" ng-model="ctrl.loginuser.password" required>
</div>
<input type="submit" value="Login">
</form>
<div ng-view></div>
这是提交表单时调用的内容:
angular.module("BaseApp", [])
.config(['$httpProvider', function($httpProvider) {
$httpProvider.defaults.xsrfCookieName = 'csrftoken';
$httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
}])
.config(['$locationProvider', function($locationProvider){
$locationProvider.html5Mode(true);
}])
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/home', {
templateURL: 'static/templates/mainPage.html'
})
/*
.otherwise({redirectTo: '/'});
*/
}])
self.loginUser = function(loginuser) {
return $http.post("/custom-api-auth/login", loginuser)
.then(function(response) {
$location.url("/home");
});
};
static/templates/mainPage.html
是这样的:
<html>
<head>
<base href="/" >
</head>
<h5>TESTTTTTTTT</h5>
我尝试对此进行测试并提交表单。 URL 更改为 /home
,但 TESTTTTTTTT
未显示。当我通过地址栏手动将静态 URL 更改为 /static/templates/mainPage.html
然后按回车键时,mainPage.html
实际上会出现。当我将 templateURL: 'static/templates/mainPage.html'
更改为 template: '<h5>This is the default route</h5>'
时,This is the default route
会正确显示。
为什么static/templates/mainPage.html
没有出现?
我正在使用 Django / DRF 作为我的后端,这是我的 urls.py
:
from django.conf.urls import url
from django.conf.urls import include
from ebdjangoapp import views
from rest_framework import routers
router = routers.DefaultRouter()
router.register(r'stuffs', views.StuffViewSet)
router.register(r'users', views.UserViewSet)
urlpatterns = [
url(r'^api/', include(router.urls)),
# templates
url(r'^$', views.HomePageView.as_view()),
url(r'^home$', views.MainPageView.as_view()),
# login logout
url(r'^custom-api-auth/login$', views.login_view.as_view()),
url(r'^custom-api-auth/logout$', views.logout_view.as_view()),
]
这是我的 views.py
:
class HomePageView(TemplateView):
def get(self, request, *args, **kwargs):
return TemplateResponse(request, "home.html")
class MainPageView(TemplateView):
def get(self, request, *args, **kwargs):
return TemplateResponse(request, "mainPage.html")
请注意,/home
服务于页面 mainPage.html
,而 /
服务于页面 home.html
(我知道这有点混乱)。
不是templateUrl,不是你$routeProvider代码中的templateURL吗?