當ng選項模型更新時，ng ng選項不會更新選擇列表

Question

我正在使用angular 1.4.12，並且我需要我的應用程序中的選擇菜單。 我使用ng-options與從異步函數填充的對象數組，但SELECT沒有看到更新，之後仍然是空的。我試着用「追蹤」，但它不起作用。 有什麼建議嗎？謝謝！

Answer 1

一對夫婦的問題在這裏

首先，在NG選項的選擇是有點複雜得多，一個簡單的綁定。

其次，嘗試避免在使用angular進行開發時使用setTimeout。由於稱爲摘要循環的過程，角綁定知道要更新。在此過程中，會評估綁定並檢查更改。這個過程由角度內部觸發，並且發生了很多。

然而問題在於setTimeout，因爲它不是角度的一部分，不會觸發摘要。所以你的選項框上的綁定永遠不會更新。爲了解決這個問題，angular提供了自己的超時助手。 $超時。

請參閱更新的fiddle以獲得工作解決方案。

ng選項需要更新到這樣的東西。你可以閱讀更多關於NG選項here

<select ng-options="item.subItem.label for item in items" ng-model="model"> 
</select> 

和你的控制器需要注入$超時以上

function MyCtrl($scope, $timeout) { 
    $scope.name = 'Try'; 
    $scope.items = []; 
    $scope.model = {}; 

    $timeout(function() { 
     $scope.items = [ 
     {subItem: {value: "a", label: "1"}}, 
     {subItem: {value: "b", label: "2"}}, 
     ]; 
     alert($scope.items.length); 
    }, 2000); 
} 

UPDATE提到的原因： 由於在下面的評論中提到，使用外部庫它自己的異步操作可能會導致附帶的角度摘要問題。一個簡單的解決方案是使用angulars諾言庫$ q。我已經更新了提琴手以包含這個例子。 Click here to see it

更新的代碼如下

function MyCtrl($scope, $q, $timeout) { 
    $scope.name = 'Try'; 
    $scope.items = []; 
    $scope.model = {}; 

    function myPromise(){ 
     var deferred = $q.defer(); 

     //Do your pouchDB request here and then call resolve in the pouchDB callback 
     $timeout(() => { 
      deferred.resolve("This would be your results object"); 
     }, 2000) 

     return deferred.promise;  
    } 

    myPromise().then((results) => { 
      $scope.items = [ 
      {subItem: {value: "a", label: "1"}}, 
      {subItem: {value: "b", label: "2"}}, 
     ]; 
     alert(results); 
    }); 
}