Question

我不明白如何使用controllerAS语法。在我的演示应用程序中，我有一个视图控制器，其语法如下：

ng-controller="mainController as ctrl"

在该HTML范围内，我有以下代码：

<h2>{{ ctrl.person.name }} <small>{{ ctrl.person.jobTitle }}</small></h2>
  <p class="lead"><a href="mailto:{{ ctrl.person.email }}">{{ ctrl.person.email }}</a></p>

尽管将控制器别名设置为“ctrl”，但我的表达式不会打印。只有从'mainController'控制器中删除'ctrl'别名时才会打印表达式。

我想我不了解范围是如何运作的。这是关闭body标签的我的js脚本：

<script type="text/javascript">
var directory = angular.module('directory', []);
directory.controller('mainController', ['$scope','$http',
  function($scope, $http) {
    $http.get('roster.json').success(function(data) {
      $scope.people = data;
      $scope.peopleOrder = 'name';
    });
  }
]);</script>

我的plunker link is here。有人可以帮我看一下推理吗？感谢

Answer 1

This article会指出您正确的方向来解决您的问题。

它的主旨是使用controllerAs语法，您不再使用$scope，而是使用this。

首先，必须让您的路由器知道：

.state('main', {
    url: '/',
    templateUrl: '...',
    controller: 'mainController',
    controllerAs: 'ctrl'
})

然后，数据绑定发生在this而不是$scope，所以这个片段：

$scope.people = data;
$scope.peopleOrder = 'name';

...变为：

this.people = data;
this.peopleOrder = 'name';

然后，在您的视图中，您可以访问数据：

<pre>{{ people }}</pre>

我认为人是一个数组，所以你必须使用ngRepeat进行迭代。

ng-Controller语法 - 别名是什么？

1 个答案: