javascript - Angular.js "Controller As" on templateUrl/template ng-click/blur/focus events not working? -

javascript - Angular.js "Controller As" on templateUrl/template ng-click/blur/focus events not working? -

i know has simple thing i'm overlooking, google not beingness friend right now.

when using "controlleras" syntax, reason if utilize element within template, clicks not register. here's plunkr

html <section ng-controller="mainctrl main"> <p>hello {{main.name}}!</p> <div class='button' ng-click="main.opendoor()">you can click , alert!</div> <dude class='button'></dude> </section> js var app = angular.module('plunker', []); app.directive('dude', function(){ homecoming { restrict: "e" , scope: {} , controller : 'main' , controlleras: 'main' // vv confusion , template: '<div ng-click="main.opendoor()">this different thing clicking nil though literall re-create pasted element!</div>' // ^^confusion , transclude : true } }).controller("mainctrl", function(){ this.name = "true"; this.opendoor = function(){ // <==== confusion. alert(object.keys(this)); }; });

you didn't set directive's controller correctly, should be:

controller : 'mainctrl'

rather main. controller property assigns actual controller, while controlleras gives alias controller object, edited using this in controller.

docs reference.

updated plunker.

javascript angularjs syntax angularjs-controller