如何通過使用angularjs來改變延遲後的值？

Question

我創建了基本的應用程序基於angularjs

HTML：

<div ng-app="miniapp"> 
<div ng-controller="Ctrl"> 
    My name is 
    <input type="text"/> 
    Val: {{val}} 
    <br/> 
    <button ng-disabled="val">Submit</button>   
</div>  

JS：

var app = angular.module('miniapp', []); 

var glob; 
function Ctrl($scope) {  
    glob = $scope;  
    $scope.val = false; 

    window.setTimeout(function() { 
      $scope.val = true; 
     }, 3000);    
} 

window.setTimeout(function() { 
      glob.val = true; 
     }, 3000); 

正如你可以看到我嘗試改變val到true通過2種方式3秒後，但沒有人爲我工作。真奇怪。我錯過了什麼？

其實我試圖從Ajax獲取響應後更改值，但假設應該是同樣的問題。

感謝，

這是我的例子：http://jsfiddle.net/6uKAT/20/

Answer 1

嘗試使用：$timeout

角的包裝爲window.setTimeout。 fn函數將 封裝到try/catch塊中，並將任何異常委託給 $ exceptionHandler服務。

$timeout(fn[, delay][, invokeApply]);

Updated Fiddle

的JavaScript

var app = angular.module('miniapp', []); 

function Ctrl($scope, $timeout) { 
    $scope.val = false; 
    $timeout(function(){$scope.val = true}, 3000);  
} 

Answer 2

你是什麼樣的角度知道外面做（超時內）的變化範圍。
所以，你應該用$timeout ..否則，您必須使用$scope.$apply()

$timeout(function() { 
    $scope.val = true; 
}, 3000); 

http://jsfiddle.net/6uKAT/21/

對於超時使用$timeout，它會調用$scope.$apply()你。
同樣，對於阿賈克斯使用$http。

，如果你不能使用這些，那麼你就必須調用$scope.$apply()自己：

window.setTimeout(function() { 
    $scope.$apply(function() { 
     $scope.val = true; 
    }); 
}, 3000);