Question

我想在功能一次运行期间向按钮显示一个微调器，完成后隐藏微调器，这就是我尝试过的：

<div ng-controller="MyController">       
        <button ng-click="InsertData()">

            <i class="fa fa-refresh fa-spin" ng-show="loading"></i>Loading
        </button>
        <br />
        {{loading}}
    </div>

这是controller.js

angular.module('MyApp', []).controller('MyController', function ($scope) {

$scope.InsertData=function()
{
    $scope.loading = true;
    $scope.one($scope.two);

}

$scope.one = function (callback) {

    setTimeout(function () { alert("this is function one"); callback(); }, 1000);

}

$scope.two = function () {
    alert("two");
    $scope.loading = false;

}

});

但这一行

$scope.loading = false;

不执行！虽然它上面的线路运行，我的意思是警报（“两个”）出现！

为什么$ scope.loading的值在回调函数中没有改变？如何解决这个问题？

Answer 1

问题是因为您使用的是setTimeout这是一个Javascript函数，这会导致问题，其中范围变量不会在范围内更新。因此，我们必须使用角度包装器$timeout()。

更多详情here，了解$timeout()与setTimeout()之间的区别here

以下是这个问题的工作小提琴。

JSFiddle Demo

$ scope变量在回调函数angularjs中不会改变

1 个答案: