角路线无限循环

Question

由于某种原因，当我的路由中有动态属性并访问该页面时，我陷入了无限循环，该页面将不断地请求自身。

.config(["$routeProvider", "$locationProvider", function($routeProvider, $locationProvider)
{
    $locationProvider.html5Mode(true);

    $routeProvider.when("/", {
        templateUrl: "pages/index.html",
        controller: "IndexCtrl"
    }).when("/listhome", {
        templateUrl: "pages/listhome.html",
        controller: "ListHomeCtrl"
    }).when("/profile", {
        templateUrl: "pages/profile.html",
        controller: "ProfileCtrl"
    }).when("/newlist", {
        templateUrl: "pages/newlist.html",
        controller: "NewListCtrl"
    }).when("/userlists/:id", {
        templateUrl: "pages/userlists.html",
        controller: "UserListsCtrl"
    }).otherwise({
        redirectTo: "/"
    });

我正在查看的路线是 /userlists/:id 路线。该路线的控制器是-

TopTenApp.controller("UserListsCtrl", ["$scope","$routeParams", function($scope, $routeParams)
{
    console.log($routeParams);
    $scope.lists = [];
}]);

当我访问 /userlists/9 时，我看到了-

Object {id: "9"}

每 3 秒记录一次，页面冻结。只要位置后面有正斜杠（“/userslists/”而不是“/userlists”），这似乎就会发生。

有人知道这是什么原因吗？

Answer 1

我很傻，我意识到了这个问题。我想这是有道理的，但是当页面深度为多个“目录”时，模板 url 前面需要有一个正斜杠。

.config(["$routeProvider", "$locationProvider", function($routeProvider, $locationProvider)
{
    $locationProvider.html5Mode(true);

    $routeProvider.when("/", {
        templateUrl: "/pages/index.html",
        controller: "IndexCtrl"
    }).when("/listhome", {
        templateUrl: "/pages/listhome.html",
        controller: "ListHomeCtrl"
    }).when("/profile", {
        templateUrl: "/pages/profile.html",
        controller: "ProfileCtrl"
    }).when("/newlist", {
        templateUrl: "/pages/newlist.html",
        controller: "NewListCtrl"
    }).when("/userlists/:id", {
        templateUrl: "/pages/userlists.html",
        controller: "UserListsCtrl"
    }).otherwise({
        redirectTo: "/"
    });
}]);

希望能帮助遇到类似问题的其他人。