Question

我正在尝试在指令中绑定变量，并使用新的Angular 1.4 bindToController语法从指令修改它。

HTML：

<body ng-app="mainModule" ng-controller="mainController">
   <h2>{{boundVar}}</h2>
<my-directive ng-model="boundVar"></my-directive>

使用Javascript：

angular.module('directiveModule', []).directive('myDirective',
function()
{
    var r = 
    {
        scope: true,
        bindToController: { value: '=ngModel' },
        template: '<h2>The value is: {{ctrl.value}}</h2><br><button ng-click="ctrl.increment()">Increment</button>',
        controllerAs: 'ctrl',
        controller: function()
        {
            this.increment = function() { this.value++; };
        }
    };

    return r;
});

angular.module('mainModule', ['directiveModule']).controller('mainController',
function($scope)
{
    $scope.boundVar = 10;
});

当页面最初加载时，您会看到变量'boundVar'被有效绑定：

enter image description here

但是当你按下按钮时，只有内部变量发生变化，所以双向绑定看起来不起作用：

enter image description here

我错过了什么？

谢谢！

Answer 1

我认为这只是常见的情况，如果您没有使用“。”，双向绑定通常不会按预期工作。在你的绑定。你不应该双向绑定到基元。即使使用新的models功能，同样的原则仍然适用。

有关更好的解释，请参阅https://stackoverflow.com/a/18128502/246811。

使用新的bindToController语法时，双向绑定不起作用

1 个答案: