$範圍變量不會在回調函數改變，angularjs

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