嵌套隔离范围之间是否可以双向绑定变量?

时间:2015-09-01 04:39:13

标签: javascript angularjs isolate-scope

考虑下面的嵌套指令。我一直在尝试在嵌套指令的隔离范围之间绑定变量,并且无法实现双向绑定。

在示例中,我希望outerPower绑定到innerPower,并在innerPower数字递增时更改。

检查小提琴http://jsfiddle.net/hally9k/sqea6Ln7/

testApp.directive('innerDirective', function () {
    return {
        scope: {
           innerPower: '&'
        },
        template: '<div><p>Inner Power = {{innerPower}}</p>' +
            '<button ng-click="increment();">Power up!</button>' +
            '</div>',
        controller: function ($scope, $element, $attrs) {
           $scope.increment = function() {
                ++$scope.innerPower;
           }
        }
    };
});

testApp.directive('outerDirective', function () {
    return {
        scope: {

        },
        template: '<div><p>Outer Power = {{outerPower}}</p>' +
            '<div inner-directive inner-power="outerPower"></div>' +
        '</div>',
        controller: function ($scope, $element, $attrs) {
           $scope.outerPower = 0;
        }
    };
});

2 个答案:

答案 0 :(得分:2)

对于双向绑定,您需要使用=作为范围变量。仅当您的指令需要在父作用域中执行函数时才应使用&

JSFiddle

scope: {
   innerPower: '='
},

答案 1 :(得分:1)

只需更改单行

即可
scope: {
     innerPower: '=' //instead of &
}