Angular Маршрут бесконечной петли

По какой-то причине, когда у меня есть динамическое свойство в моем маршруте и доступ к этой странице, я застреваю в бесконечном цикле, где эта страница будет постоянно запрашивать себя.

.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" ).

Кто-нибудь знает причину этого?

Ответ 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: "/"
    });
}]);

Надеюсь, это поможет кому-то еще с подобной проблемой.