ngShow 超时未按预期工作

Question

我正在纠结如何让ngShow在指定的超时时间内确定表达式，结果Angular可以计算表达式但无法反映视图中的变化，这是我使用的代码

（查看）

<button 
    type="button" 
    class="btn btn-primary rule-fade" 
    tooltip="{{ proLang.tooltip.ruleApplyBtnTxt }}" 
    ng-click="applyRule('basic')"
    ng-show="showApplyBtns(selectedRules, selectedObj)"
>

    <span class="glyphicon glyphicon-dashboard"></span>
    Apply Rules
</button>

（控制器）以及实现 showApplyBtn 函数的控制器

//determine whether apply buttons should be shown
$scope.showApplyBtns = function(selectedRules, selectedObj) {
    $timeout(function() {
        return selectedRules.length == 1 && selectedObj.length == 1;
    },500);
};

Angular可以判断结果（true or false），但是view好像没有反映出变化。

任何帮助将不胜感激，谢谢！

Answer 1

与其使用 showApplyBtns return 值，不如尝试将值分配给作用域变量。

然后您的 button 可以将该值绑定到 ng-show

<button 
    type="button" 
    class="btn btn-primary rule-fade" 
    tooltip="{{ proLang.tooltip.ruleApplyBtnTxt }}" 
    ng-click="applyRule('basic')"
    ng-show="showApplyBtns"
>

然后更改您的控制器，以便 applyRule() 调用 updateShowAppyBtns，这将更新绑定变量 showApplyBtns

$scope.applyRule(...) {
    ...
    $scope.updateShowApplyBtns();
}

//determine whether apply buttons should be shown
$scope.updateShowApplyBtns = function() {
    $timeout(function() {
        $scope.showApplyBtns = $scope.selectedRules.length == 1 && $scope.selectedObj.length == 1;
    },500);
};

现在，当 updateShowApplyBtns 被调用时，$timeout 函数将更新 $scope.showApplyBtns，因为更新后的值现在绑定到按钮上的 ng-show，按钮的可见性会更新的。

解释

您遇到的问题是您的 showApplyBtns 实际上 return 没有值

$scope.showApplyBtns = function(selectedRules, selectedObj){
    $timeout(function(){
        return selectedRules.length == 1 && selectedObj.length == 1;
    },500);
    // return undefined (this is what actually happens here)
};

传递给 $timeout 的匿名函数 return 是一个值...但是这个值被 $timeout 函数吞没了， showApplyBtns 没有任何东西可以 return，因此它 return 是 undefined 的默认值。

如您所想，showApplyBtns 等待 $timeout 完成后再 return 自己的值是不合适的，因为那样会阻塞 i/o （它会在等待时停止所有执行，这在设计上很难在 javascript 中做到）。

由于 showApplyBtns 不能等待 $timeout 到 return 一个值，然后再 return 自己的值，除了利用管理更新的状态持久性（如我上面的回答所示）。

希望对您有所帮助。 :)

ngShow 超时未按预期工作

timeout for ngShow not working as expected

javascript

timeout

angularjs