У меня есть контроллер:
function myController($scope) {
$scope.clicked = false;
}
И директива:
function myDirective() {
return {
restrict: 'E',
link: function(scope, elem, attrs) {
elem.bind('click', function() {
// need to update controller $scope.clicked value
});
},
template: '<div>click me</div>';
replace: true;
}
}
И я использую это так:
<div ng-controller="myController">
<my-directive></my-directive>
</div>
Как я могу изменить значение контроллера $ scope.clicked? Спасибо!
3 ответа
Поскольку вы не используете изолированную область в своей директиве, вы можете использовать scope.$parent.clicked
для доступа к свойству родительской области.
link: function(scope, elem, attrs) {
elem.bind('click', function() {
scope.$parent.clicked = ...
});
},
Мне нравится использовать $ scope. $ Emit для таких целей. Это позволяет отправлять данные из директивы в контроллер. Вы должны создать собственный слушатель в вашем контроллере:
$scope.$on('cliked-from-directive', function(event, data){
console.log(data)
})
Как видите, теперь у вас есть полный доступ к области действия вашего контроллера, и вы можете делать все, что захотите. И в вашей директиве просто использовать scope.$emit
link: function (scope, elem, attrs) {
elem.bind('click', function() {
scope.$emit('cliked-from-directive', {a:10})
});
Здесь я создал для вас jsfiddle
Я бы не рекомендовал использовать scope.$parent
для обновления или доступа к значениям родительской области, вы можете two way bind
переменную контроллера, которую необходимо обновить в вашей директиве, поэтому ваша директива становится:
function myDirective() {
return {
restrict: 'E',
scope: {
clicked: '='
},
link: function(scope, elem, attrs) {
elem.bind('click', function() {
// need to update controller $scope.clicked value
$scope.clicked = !$scope.clicked;
});
},
template: '<div>click me</div>';
replace: true;
}
}
Теперь передайте это clicked
от родителя:
<div ng-controller="myController as parentVm">
<my-directive clicked="parentVm.clicked"></my-directive>
</div>
function myController() {
var parentVm = this;
parentVm.clicked = false;
}
Я бы порекомендовал прочитать об использовании controllerAs
синтаксиса для вашего контроллера, поскольку это действительно укрепило бы концепцию использования двухстороннего связывания здесь.
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.