Question

我正在构建一个MEAN应用程序并使用yeoman来构建客户端代码。我有一个叫做电影的控制器和视图。

这是电影控制器：

'use strict';

/**                                                                                                                                                                                  
 * @ngdoc function                                                                                                                                                                   
 * @name clientApp.controller:MoviesCtrl                                                                                                                                             
 * @description                                                                                                                                                                      
 * # MoviesCtrl                                                                                                                                                                      
 * Controller of the clientApp                                                                                                                                                       
 */
angular.module('clientApp')
  .controller('MoviesCtrl', function () {
      this.movies = [
          {
              title: 'A New Hope',
              url: 'http://youtube.com/embed/1g3_CFmnU7k'
          },
          {
              title: 'The Empire Strikes Back',
              url: 'http://youtube.com/embed/96v4XraJEPI'
          },
          {
              title: 'Return of the Jedi',
              url: 'http://youtube.com/embed/5UfA_aKBGMc'
          }
      ];

  });

这是电影视图：

<table class="table table-striped">
  <thead>
    <th>Title</th>
    <th>URL</th>
  </thead>
  <tbody>
    <tr ng-repeat="movie in movies">
      <td>{{movie.title}}</td>
      <td>{{movie.url}}</td>
    </tr>
  </tbody>
</table>
{{movies}}

当我在浏览器中查看页面时，ng-repeat不起作用（没有打印出来），但是我在视图中明确打印出{{movies}}，我看到我定义的电影json在控制器中。所以，我知道视图可以访问控制器的范围。

为什么即使视图可以访问控制器的范围，ng-repeat也不工作？

Answer 1

为了使用this.movies，您需要使用控制器AS语法（MovieCtrl作为ctrl）。即便如此，如果您不保存控制器对象（例如，vm = this）

，也可能会遇到问题

现在你的方式，你需要分配到$ scope而不是这个

Answer 2

ng-repeat创建一个新的子范围，但您的父范围没有电影对象，因此您必须将$ scope注入控制器并指定它是如何正常完成的（例如， $ scope.movies = ...）。

对于这种情况，当你想使用＆＃34;这个＆＃34;关键字，你只需要使用＆＃34; MoviesCtrl作为moviesCtrl＆＃34;在你的标记中，然后使用＆＃34; moviesCtrl.movies＆＃34;获取ng-repeat中的对象。

为什么{{movie}}似乎有效的原因很可能是因为插值的工作方式。

我的AngularJS视图能够访问它的控制器范围，但ng-repeat不起作用

2 个答案: