javascript - templateUrl/template ng-click/blur/focus事件上的Angular.js“Controller As”无效吗？

我知道这必须是一件简单的事情，但我现在却无法与Google成为朋友。

使用"controllerAs"语法时，由于某种原因，如果我将其用于模板中的元素，则单击不会注册。
这是一个plunkr

html

<section ng-controller="MainCtrl as main">
    <p>Hello {{main.name}}!</p>
    <div class='button' ng-click="main.openDoor()">You can click this and it will alert!</div>

    <dude class='button'></dude>
</section>

js

var app = angular.module('plunker', []);

app.directive('dude', function(){
  return {
    restrict: "E"
    , scope: {}
    , controller : 'main'
    , controllerAs: 'main'

// vv confusion

    , template: '<div ng-click="main.openDoor()">This is a different thing but clicking it does nothing even though i literall copy pasted this element!</div>'

// ^^confusion

    , transclude : true
  }
}).controller("MainCtrl", function(){
  this.name = "true";
  this.openDoor = function(){     // <==== confusion.
    alert(Object.keys(this));
  };
});

最佳答案

您没有正确设置指令的控制器，它应该是：

controller : 'MainCtrl'

而不是main。 controller属性分配实际的控制器，而controllerAs为控制器对象提供别名，该别名在控制器中使用this编辑。

Docs reference。

更新了plunker。