Функция контроллера после события ngChange в директиве

Question

Я нашел несколько вопросов и примеров, но все они используют $ scope, пока я не использую $ scope в своем приложении. Я пытаюсь выполнить функцию контроллера, когда выбран флажок в директиве (ng-change).

JSFiddle

HTML

<div ng-app="myApp" ng-controller="Controller as ctrl"> 
    <dir-select doIt="ctrl.doIt()" object="ctrl.object"> 
</div> 

контроллер и Директива

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

app.controller("Controller",[ function() { 
    var ctrl = this; 
    ctrl.object = { 
     name: "test", 
     selected: false 
    }; 
    ctrl.doIt = function() { 
     alert("Doing It!"); 
    }; 
}]); 

app.directive('dirSelect', function() { 
    return { 
    restrict: 'E', 
    template: '<input type="checkbox" ng-model="object.selected" ng-change="doIt()">select', 
    scope: { 
     object: '=', 
     doIt: '&' 
    } 
    }  
}); 

Что мне не хватает?

Answer 1

Пожалуйста, попробуйте этот

<dir-select do-it="ctrl.doIt()" object="ctrl.object"> 

и в директиве

template: '<input type="checkbox" ng-model="object" ng-change="doIt()">select', 

Answer 2

отредактировали HTML:

<div ng-app="myApp" ng-controller="Controller as ctrl"> 
    <input type="checkbox" ng-change="ctrl.doIt()" ng-model="ctrl.object">   
</div> 

Проверил: http://jsfiddle.net/9nmyom0h/

Answer 3

Угловая нормализующий ATT имена ребер. В коде HTML вы должны использовать формат с разделителями тире вместо верблюжьего футляра. Просто измените doIt="ctrl.doIt()" на do-it="ctrl.doIt()". См. Код ниже.

<div ng-app="myApp" ng-controller="Controller as ctrl"> 
    <dir-select do-it="ctrl.doIt()" object="ctrl.object"> 
</div>