Javascript 控制器的指令和实例

我目前正试图理解我发现的一段代码，其中有一部分让我很难理解

I指令的声明方式如下：

(function () {    
  angular
    .module('meanApp')
    .directive('navigation', navigation);

  function navigation () {
    console.log("enters directive");
    return {
      restrict: 'EA',
      templateUrl: '/common/directives/navigation/navigation.template.html',
      controller: 'navigationCtrl as navvm'
    };
  }
})();

控制员：

(function () {
  angular
    .module('meanApp')
    .controller('navigationCtrl', navigationCtrl);

  navigationCtrl.$inject = ['$location','authentication'];
  function navigationCtrl($location, authentication) {
    console.log("enters navigation controller")
    var vm = this;

    vm.isLoggedIn = authentication.isLoggedIn();

    vm.currentUser = authentication.currentUser();
  }
})();

观点：

<div class="navbar navbar-default">
  <div class="container">
    <div id="navbar-main">
      <ul class="nav navbar-nav">
        <li><a href="/">Home</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li ng-hide="navvm.isLoggedIn"><a href="login">Sign in</a></li>
        <li ng-show="navvm.isLoggedIn"><a href="profile">{{ navvm.currentUser.name }}</a></li>
      </ul>
    </div>
  </div>
</div>

我不明白的是： 为什么在控制器中使用的控制器实例名为“vm”时使用“nvvm”变量。 在视图中，我会选择使用

vm.currentUser.name

而不是

navvm.currentUser.name

---

感谢您帮助我了解指令中提到的这个细节

：

controller: 'navigationCtrl as navvm'

可以使用视图中的

navm

别名引用

navigationCtrl

，解释

navvm.currentUser.name

如果有那么多麻烦，只需将控制器

alias

更换为：

controller: 'navigationCtrl as vm'

并根据需要使用它：

vm.currentUser.name

---

请注意，此

别名

允许您使用

此

将数据绑定到

控制器

，从而消除

$scope

关键字。

nvvm是控制器名称的别名，因此您可以使用nvvm代替navigationCtrl

---

vm是控制器内的一个变量，因此无法从页面访问

controller:'navigationCtrl as vm'

您可以重命名它。谢谢您的解释。但是如果我们在指令中声明别名nvvm，我不明白为什么它现在可以工作，但在控制器中，它被用作vm…@ArnaudAd别名有两个主要用途：在视图中使用它，就像在

navvm.currentUser.name

中使用它一样。去掉控制器中的

$scope

关键字，将需要向视图公开的值绑定到

this

。你可以看到，在你的控制器中，你使用了一个名为

vm

的变量，你绑定到了this，解释了你控制器中的

vm.isLoggedIn

&

vm.currentUser

。事实上，我没有尝试就接受了你的答案（因为我确信它会起作用），但我只是尝试了，它不起作用。控制台中没有错误。。。我不知道问题出在哪里from@ArnaudAd您是否也更新了视图

@ArnaudAd您是否也更改了指令中的控制器别名？