Question

在指令中，我想在单击按钮时修改表达式的值。以下代码仅在我的指令中本地修改值。我也想改变这个指令之外的值。我怎么能做到这一点？

        scope: false,
        link: function (scope, el, attrs) {
            //toggle the state when clicked
            el.bind('click', function () {
                scope[attrs.ngModel] = !scope[attrs.ngModel];
            });

Plunker：http://plnkr.co/edit/xqYBnz5BHLP844kXJXKs?p=preview

Answer 1

问题在于ng-model中的结合表达。因为它有'。'在其中，您需要使用$parse来正确获取和设置值。请参阅一些文档here

像

这样的东西

 var getter=$parse(attrs.ngModel);
 var setter=getter.assign;
 setter(scope,!getter(scope));

在此处查看我更新的plunkr http://plnkr.co/edit/VAE43y5cagCF8jq5AlaY?p=preview

基本上设置

scope[attrs.ngModel] = !scope[attrs.ngModel]

创建一个新属性user.active。设置它应该是scope['user']['active'];

Answer 2

由于您没有创建新范围，因此您应该可以通过scope而非attrs

访问该模型

在指令中，将范围更改为

scope: {
    ngModel: '='
},

并更改范围。$ apply to

scope.$apply(function () {
    if (scope.ngModel) {
        off();
        scope.ngModel = false;
    } else {
        on();
        scope.ngModel = true;
    }
});

的 DEMO

Answer 3

另一种方法是创建一个隔离范围，并在您的指令中传递一个属性，该属性将它链接到父范围内的方法，该方法将执行翻转状态的工作。

粗略的例子：

在你的指令定义中：

scope: {
    flipState: '&'
},
link: function (scope, elem, attr) {
    elem.bind('click', function () {
        flipState();
    }
}

在您看来：

<div ng-controller="MyController">
    /* ... */
    <button directivename flip-state="flipStateFunc()"></button>
</div>

在您的控制器中MyController：

flipStateFunc: function () {
    $scope.state = !$scope.state;
}

如何在指令中修改范围的值

3 个答案: