AngularJS $ routeParams未定义

时间:2015-02-14 07:22:39

标签: javascript angularjs

我为$ routeParams获得undefined。这是我的代码:

var ngAddressBook = angular.module('ngAddressBook', ['ngRoute']);

ngAddressBook.config(['$routeProvider',
    function($routeProvider) {
        $routeProvider.
            when('/', {
                templateUrl: 'views/list.html',
                controller: 'ngAddressListController'
            }).
            when('/add', {
                templateUrl: 'views/add.html',
                controller: 'ngAddressListController'
            }).
            when('/details/:id', {
                templateUrl: 'views/details.html',
                controller: 'ngAddressDetailsController'
            });
    }]);
// add a controller to it
ngAddressBook.controller('ngAddressListController', ['$scope', function ($scope)
    {
        $scope.contacts = [
            {id:1,first_name:'Jane', last_name:'Doe','Phone':'123-456789','Email':'jane@example.com'},
            {id:2,first_name:'Jhon', last_name:'Doe','Phone':'123-456789','Email':'jhon@example.com'}
        ];
        $scope.getTotalContacts = function () {
            return $scope.contacts.length;
        };
    }]);

ngAddressBook.controller('ngAddressDetailsController', ['$scope', function ($scope,$routeParams)
{
    alert($routeParams);
    $scope.id = $routeParams.id;
}]);

的index.html

<!doctype html>
<html ng-app="ngAddressBook">
<head>
    <title>Ng Addressbook</title>
    <link href="main.css" rel="stylesheet" media="screen" />
</head>
<body>
    <div ng-controller="ngAddressListController">
        <div id="container">
            <h1>Ng Address Book</h1>
            <div id="content" ng-view>
            </div>
        </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.min.js"></script>
    <script src = "angular-route.min.js"></script>
    <script src="main.js"> </script>
</body>
</html>

2 个答案:

答案 0 :(得分:13)

控制器参数注入存在问题。您尚未在阵列注入列表中添加$routeParams

ngAddressBook.controller('ngAddressDetailsController', ['$scope','$routeParams', function ($scope,$routeParams)
{
    alert($routeParams);
    $scope.id = $routeParams.id;
}]);

答案 1 :(得分:1)

正如我在google上发现这一点: 除了缺少注射 - 对象$routeParams而不是关键$routeParams.id

I found the explination here (from Sander Elias)

ngAddressBook.controller('ngAddressDetailsController', ['$scope','$routeParams', function ($scope,$routeParams)
{
    $scope.id = $routeParams
    alert($routeParams);
}]);