angularjs - AngularJS路线不起作用

Question

我尝试从 Angular JS 制作“入门”教程，但在设置链接的路由时遇到问题：当用户单击链接时，不会调用该路由的控制器。

这是我的代码：

angular.module('phonecat', []).
config(['$routeProvider',
    function ($routeProvider) {
        $routeProvider.
        when('/phones', {
            templateUrl: 'partials/phone-list.html',
            controller: PhoneListCtrl
        }).
        when('/phones/:phoneId', {
            templateUrl: 'partials/phone-detail.html',
            controller: PhoneDetailCtrl
        }).
        otherwise({
            redirectTo: '/phones'
        });
    }
]);

function PhoneDetailCtrl($scope, $routeParams, $http) {
    $scope.phoneId = $routeParams.phoneId;

    $scope.total = 4;
    $http.get('phones/' + $routeParams.phoneId + '.json').success(function (data) {
        $scope.phone = data;
    });
}

function PhoneListCtrl($scope, $http) {
    $http.get('phones/phones.json').success(function (data) {
        $scope.phones = data;
    });

    $scope.orderProp = 'age';
}

Answer 1

你用的是什么 angularjs 版本？我也遵循教程，它使用 angular-1.0.0rc7.js，如果我在 app.js 文件中查找，它使用template而不是templateUrl：

$routeProvider.when('/phones', {
    template: 'partials/phone-list.html',
    controller: PhoneListCtrl
});

因此，通过查看您的代码，您可能想要使用angular-1.0.3.jsRC 或之前的版本

Answer 2

这应该可以，但是您需要确保链接位于作为应用程序根目录的 DOM 元素内；即(ng-app='my-app')。没有看到页面标记很难分辨。

Answer 3

提问者解决了这个问题：

我解决了这个问题——实际上我有本教程下一步的 HTML，它弄乱了应用程序，主要是因为它与模型中尚不存在的属性绑定。