AngularJS:范围变量更新速度不够快

我的指令中有以下代码

//Directive Code
var BooleanWidgetController = function ($scope, $filter) {

    $scope.booleanOptions = [
        {
            displayText: '-- ' + $filter('i18n')('Widgets.Generics.Select') + ' --'
        },
        {
            value: 1,
            displayText: $filter('i18n')('Widgets.Generics.Yes')
        },
        {
            value: 0,
            displayText: $filter('i18n')('Widgets.Generics.No')
        }
    ];

    //Added inside watch because query was not being updated if filterUpdated was called using ng-change
    $scope.$watch('query', $scope.filterUpdated);
};

app.directive('acxBooleanColumnHeaderFilter', function () {
    return {
        restrict: 'A',
        replace: true,
        controller: ['$scope', '$filter', BooleanWidgetController],
        scope: {
            query: '=',
            filterUpdated: '&submit',
            columnHeading: '@'
        },
        templateUrl: 'mailSearch/directives/columnHeaderWidgets/boolean/booleanColumnHeaderWidget.tpl.html'
    };
});

//Template
<div class="columnHeaderWidget">
<div class="title pull-left">{{columnHeading}}</div>
<div style="clear:both"></div>
<select ng-model="query" ng-options="option.value as option.displayText for option in booleanOptions">
</select>

目前的方法很有效。但当我尝试做这样的事情时

<select ng-model="query" ng-change="filterUpdated" ng-options="option.value as option.displayText for option in booleanOptions">

---

$scope.query更新速度不够快。因此，在调用$scope.filterUpdated之后，$scope.query将被更新。我在这里遗漏了什么？

这比表面看起来要复杂得多，如果你想了解真正的问题，请看看这个：

总之，问题在于：当触发ng change函数时，案例查询中指令的绑定范围属性已在指令的范围内更新，但在继承它们的范围内没有更新

我建议的解决办法是：

更改filterUpdated函数，使其从参数获取查询，而不是从其作用域获取查询，因为其作用域尚未更新

在指令的作用域中创建一个中间函数，以捕获ng更改事件和更新的作用域属性

使用该中间函数调用FilterUpdate函数并将查询作为参数传递

大概是这样的：

var BooleanWidgetController = function ($scope, $filter) {

    $scope.booleanOptions = [
        {
            displayText: '-- ' + $filter('i18n')('Widgets.Generics.Select') + ' --'
        },
        {
            value: 1,
            displayText: $filter('i18n')('Widgets.Generics.Yes')
        },
        {
            value: 0,
            displayText: $filter('i18n')('Widgets.Generics.No')
        }
    ];

    $scope._filterUpdated = function(){ $scope.filterUpdated({query:$scope.query}); };        

    /** Remove this, you won't need it anymore
     ** $scope.$watch('query', $scope.filterUpdated);
     **/
};

<select ng-model="query" ng-change="_filterUpdated" ng-options="option.value as option.displayText for option in booleanOptions">

function filterUpdated(query){
   ...
}

更改HTML，使其如下所示：

var BooleanWidgetController = function ($scope, $filter) {

    $scope.booleanOptions = [
        {
            displayText: '-- ' + $filter('i18n')('Widgets.Generics.Select') + ' --'
        },
        {
            value: 1,
            displayText: $filter('i18n')('Widgets.Generics.Yes')
        },
        {
            value: 0,
            displayText: $filter('i18n')('Widgets.Generics.No')
        }
    ];

    $scope._filterUpdated = function(){ $scope.filterUpdated({query:$scope.query}); };        

    /** Remove this, you won't need it anymore
     ** $scope.$watch('query', $scope.filterUpdated);
     **/
};

<select ng-model="query" ng-change="_filterUpdated" ng-options="option.value as option.displayText for option in booleanOptions">

function filterUpdated(query){
   ...
}

---

我的代码已经按照问题中提到的那样工作了，但我不理解的是为什么查询范围变量更新不够快。如果我执行一个级联调用，比如$scope.query=0$范围。过滤器更新；，filterUpdated函数将不具有$scope.query，因为0而$scope.query将具有以前的值。