изменение переменной контекста контроллера в директиве не отражается в функции контроллера
В моей директиве у меня есть переменная контроллера, страница, которая увеличивается при нажатии кнопки в директиве. Тем не менее, следующая строка,scope.alertPage() который вызывает функцию контроллера, не отражает это изменение. Обратите внимание, когда вы нажимаете кнопку, страница по-прежнему оповещается как 1!
Я знаю, что могу это исправить, добавив $ scope. $ Apply в контроллере, но затем я получаю сообщение об ошибке, которое говорит, что дайджест уже выполняется.
app = angular.module('app', []);
app.controller('myCtrl', function($scope) {
$scope.page = 1;
$scope.alertPage = function() {
alert($scope.page);
}
})
app.directive('incrementer', function() {
return {
scope: {
page: '=',
alertPage: '&'
},
template: '<button ng-click="incrementPage()">increment page</button>',
link: function(scope, elem, attrs) {
scope.incrementPage = function() {
scope.page += 1;
scope.alertPage();
}
}
}
})
HTML шаблон:
<body ng-app='app' ng-controller='myCtrl'>
page is {{page}}
<incrementer page='page' alert-page='alertPage()'></incrementer>
</body>