Question

我有一个控制器：

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的控制器值？谢谢！

Answer 1

由于您未在指令中使用隔离范围，因此可以使用scope.$parent.clicked访问父范围属性。

link: function(scope, elem, attrs) {
            elem.bind('click', function() {
                scope.$parent.clicked = ...
            });
        },

Answer 2

我不建议使用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语法的控制器，因为这样可以巩固使用双向绑定的概念。

从指令更改控制器$ scope

2 个答案: