Question

我最近正在阅读约翰帕帕的舆论AngularJS style guide，并注意到他对控制者的约定：

/* recommended */
function Customer () {
  var vm = this;
  vm.name = {};
  vm.sendMessage = function () { };
}

当它在控制器中使用时，它可以正常工作，因为你可以做这样的事情（他的例子）：

<!-- recommended -->
<div ng-controller="Customer as customer">
    {{ customer.name }}
</div>

然而，我更喜欢它如何与依赖于此控制器的指令一起工作。例如，在我的控制器上使用$scope我可以这样做：

testModule.directive("example", function(){
    return{
        template: "Hello {{customer}}",
        controller: "exampleCtrl"
    }
});
testModule.controller("exampleCtrl", exampleCtrl);
function exampleCtrl($scope){
    $scope.message = "Display this";
}

但我无法使用this.message：

执行此操作

testModule.directive("example", function(){
    return{
        template: "Hello {{customer}}", //Doesn't work!
        controller: "exampleCtrl"
    }
});
testModule.controller("exampleCtrl", exampleCtrl);
function exampleCtrl(){
    var vm = this;
    vm.message = "Display this";
}

所以我的问题是，如何在指令中这项工作？我尝试过使用：

{{customer}}
{{this.customer}}
{{exampleCtrl.customer}}

没有人工作。正如你所看到的，我在黑暗中拍摄并没有真正理解差异以及我如何在Angular而不是this中使用scope。此外，由于这不是惯例，我无法找到许多资源，因为它比Angular更像是一个JS理解的东西。

感谢任何帮助！

Answer 1

使用此样式时，指令应根据Directive文档在其返回对象中使用controllerAs属性。

你的指令最终会像：

testModule.directive("example", function() {
    return {
        template: "Hello {{controller.customer}}",
        controller: "exampleCtrl",
        controllerAs: "controller"
    };
});

Answer 2

我相信controller: 'exampleCtrl as controller'也有效。我应该确认一下，但是我太懒了。

使用＆＃34;这个＆＃34;而不是＆＃34;范围＆＃34;使用AngularJS控制器和指令

2 个答案: