Angular 双向绑定未按预期工作

Question

这是我的指令。 value 绑定到范围变量 (session_number)，而 change 是一个获取当前 session_number 并执行一些检查的函数。

return {
                restrict: 'A',
                scope: { value: '=value',change:'&change' },
                template: '<a href="javascript:;" class="counter-minus" ng-click="minus()">-</a>\
                          <input type="text" class="counter-field" ng-model="value" ng-change="changed()" ng-readonly="readonly">\
                          <a  href="javascript:;" class="counter-plus" ng-click="plus()">+</a>',

        link: function( scope , element , attributes ) {
                        // Make sure the value attribute is not missing.
                        if ( angular.isUndefined(scope.value) ) {
                            throw "Missing the value attribute on the counter directive.";
                        }

                        var min = angular.isUndefined(attributes.min) ? null : parseInt(attributes.min);
                        var max = angular.isUndefined(attributes.max) ? null : parseInt(attributes.max);
                        var step = angular.isUndefined(attributes.step) ? 1 : parseInt(attributes.step);

                        element.addClass('counter-container');

                        // If the 'editable' attribute is set, we will make the field editable.
                        scope.readonly = angular.isUndefined(attributes.editable) ? true : false;

                        /**
                         * Sets the value as an integer.
                         */
                        var setValue = function( val ) {

                            scope.value = parseInt( val );                    
                            scope.change();


                        }
                        setValue(scope.value + 1);
          }

     }

我在想，为什么scope.change()先于scope.value执行。因为在 change() 中我使用了绑定到 scope.value 的 session_number，但是 session_number 总是有一个旧值。就像执行 scope.change() 时， scope.value 还没有改变 session_number 变量。

Answer 1

我知道问题出在哪里，多亏了这个答案：

使用原始值的双向双向投标无法按预期工作。

Scope inheritance is normally straightforward, and you often don't even need to know it is happening... until you try 2-way data binding (i.e., form elements, ng-model) to a primitive (e.g., number, string, boolean) defined on the parent scope from inside the child scope.

所以我需要将 value 绑定从原始值更改为对象。

Angular 双向绑定未按预期工作

Angular two-way binding not working as expected

javascript

angularjs

angularjs-directive