$ scope。$ watch回调在延迟后执行

时间:2015-07-21 16:33:44

标签: angularjs

我有以下内容:

$scope.$watch('duration.dayPreference',function(value){
        console.log(value);
        if(value=='every')
        {
             that.duration.days = 1;
        }
        else if(value=='selected')
        {
            //alert('test');
            that.duration.days=[];
        }
        else if(value=='everyday')
        {
            that.duration.days='everyday';
        }

    });

    this.selectDay = function (day) {
        $scope.duration.dayPreference = 'selected';
        //$scope.$apply();
        /*if(typeof(this.duration.days)!='object')
        {
            this.duration.days=[];
        }*/

        var index = this.duration.days.indexOf(day);
        if (index == -1) {
            //alert('test2');
            this.duration.days.push(day);
        }
        else {
            this.duration.days.splice(index, 1);
        }
    }

在此,当我$scope.duration.dayPreference = 'selected';时,我希望它下面的行将this.duration.days设置为空白数组。但它并没有。经过仔细检查,我发现$ watch中的回调在分配下面的行之后运行。

很可能,$ watch可能在内部使用某种计时器。那么应该怎么做呢。

2 个答案:

答案 0 :(得分:1)

在摘要运行之前,手表不会被触发。这将是在你的整个职能竞争之后。

如果您认为AngularJS本身是用JavaScript编写的,那么它就无法对您当时的属性设置做出反应。您自己使用该线程。它只能等你完成然后再做出反应。

至于做什么......
也许您可以手动调用该手表功能? 或者,期望空数组的代码应该属于手表内部?

答案 1 :(得分:0)

Watch将在$digest上触发,这将在当前周期/代码完成运行后发生。您需要找到一种重新排列代码的方法,以异步方式处理事物。一种可能的快速解决方案可能是:

var selectedDays = [];
$scope.$watch('duration.dayPreference',function(value){
    console.log(value);
    if(value=='every')
    {
         that.duration.days = 1;
    }
    else if(value=='selected')
    {
        //alert('test');
        that.duration.days = selectedDays;
    }
    else if(value=='everyday')
    {
        that.duration.days='everyday';
    }

});

this.selectDay = function (day) {
    $scope.duration.dayPreference = 'selected';

    var index = selectedDays.indexOf(day);
    if (index == -1) {
        //alert('test2');
        selectedDays.push(day);
    }
    else {
        selectedDays.splice(index, 1);
    }
}