Question

以下是我的角度代码。我搜索了很多错误的解决方案，提到的解决方案包括['ngroute']，我已经包含但仍然没有解决错误。

以下是代码：

的index.html

 <!DOCTYPE html>
 <html ng-app="myapp">
<head>
    <script type="text/javascript" src="angular.min.js"></script>
    <script type="text/javascript" src="angular-route.min.js"></script>
    <script type="text/javascript" src="controller.js"></script>
</head>
<body>
    <h1>Amail</h1>
    <div ng-view></div>
</body>
  </html>

controller.js

  var aMailservices=angular.module("myapp",['ngRoute']);

  function emailRouteConfig ($routeProvider,$locationProvider) {
   $locationProvider.html5mode(true);
   $routeProvider.
   when('/',{
    controller:'ListController',
    templateUrl:'list.html'
   }).
   when('/view/:id',{
    controller:'DetailController',
    templateUrl:'detail.html'
   }).
   otherwise({
    redirectTo:'/'
   });
   }

   aMailservices.config(emailRouteConfig);


   messages = [{
        id: 0, sender: 'jean@somecompany.com', subject: 'Hi there, old friend',
        date: 'Dec 7, 2013 12:32:00', recipients: ['greg@somecompany.com'],
        message: 'Hey, we should get together for lunch sometime and catch up.'
        +'There are many things we should collaborate on this year.'
        }, {
        id: 1, sender: 'maria@somecompany.com',
        subject: 'Where did you leave my laptop?',
        date: 'Dec 7, 2013 8:15:12', recipients: ['greg@somecompany.com'],
            message: 'I thought you were going to put it in my desk drawer.'
        +'But it does not seem to be there.'
        }, {
        id: 2, sender: 'bill@somecompany.com', subject: 'Lost python',
        date: 'Dec 6, 2013 20:35:02', recipients: ['greg@somecompany.com'],
        message: "Nobody panic, but my pet python is missing from her cage."
        +"She doesn't move too fast, so just call me if you see her."
        } ];

    function ListController($scope){
    $scope.messages=messages;
          }

     function DetailController($scope,$routeParams){
      $scope.message=messages[$routeParams.id];
         }

list.html

 <table>
<tr>
    <td><strong>Sender</strong></td>
    <td><strong>Subject</strong></td>
    <td><strong>Date</strong></td>
</tr>   
<tr ng-repeat='message in messages'>
        <td>{{message.sender}}</td>
        <td><a href="#/view/{{message.id}}"></a></td>
        <td>{{message.date}}</td>
</tr>

detail.html

<div><strong>Subject:</strong>{{message.subject}}</div>
<div><strong>Sender:</strong>{{message.sender}}</div>
<div><strong>Date:</strong>{{message.date}}</div>
<div>
<strong>To:</strong>
<span ng-repeat="recipient in message.recipients">{{recipient}}</span>
</div>
<div>{{message.message}}</div>
<a href="#/">Back to message list</a>

Answer 1

我建议您将控制器添加到模块中，否则他们将无法接收$ routeParams。依赖项被注入到您的模块中;如果您的控制器未添加到模块中，则它们将无法利用注入模块的依赖关系。

执行以下操作：

angular.module("myapp",['ngRoute']).config(function($routeProvider,$locationProvider) {})
.controller('DetailController', function($scope,$routeParams){});

Angularjs注射器模块化器

1 个答案: