javascript - 将对象(变量)传递给指令 angularjs

Question

Controller 在状态中被调用。

.controller('test', function($scope) {
    $scope.variable = 'Hello';
    $scope.other = 'Hi';
})
.directive('customDir', function() {
    return {
        restrict: 'A',
        link: function($scope, element, attrs) {
            attrs.customDir += ' Word';
        }
    }
});

<小时/>

<input type="text" custom-dir="variable" />
<div>{{variable}}</div>

<input type="text" custom-dir="other" />
<div>{{other}}</div>

<小时/>

我需要 $scope.variable 和 $scope.other 接收“Word”，必须能够更改指令中传递的变量的值。

Answer 1

有几种方法。第一个是使用双向绑定(bind):

.directive('customDir', function() {
    return {
        scope: {customDir: '='},
        link: function(scope, element, attrs) {
            scope.customDir += ' Word';
        }
    }
});

演示: http://plnkr.co/edit/zQOMttjnbvdf6OJNOeoq?p=preview

如果您不需要新的隔离范围，则另一种:

.directive('customDir', function() {
    return {
        link: function(scope, element, attrs) {
            scope[attrs.customDir] += ' Word';
        }
    }
});

演示: http://plnkr.co/edit/FmIy3z4t1SEJQn1YQAkP?p=preview