使用異步填充的選項編輯項目

Question

我有一張需要編輯的項目表。當單擊編輯時，另一個控制器（EditCtrl）對其進行編輯。 EditCtrl通過ajax調用檢索可能值的列表。我遇到的問題是下拉菜單沒有選擇的項目。

請參閱本例http://plnkr.co/edit/mUciM4I37aN3lbC6ecIo?p=preview如果您點擊保時捷，底部會顯示「車輛顏色爲紅色」。但下拉菜單不會選擇紅色。

Answer 1

在您的示例中，您使用的是window.setTimeout，因此select中的選項甚至不會更新。爲了得到它與你需要用在$apply內容window.setTimeout工作：

window.setTimeout(function() { 
    $scope.$apply(function() { 
    $scope.colors = [ 
     {code: "#ff0000", name: "red"}, 
     {code: "#0000ff", name: "blue"}, 
     {code: "#00ff00", name: "green"}]; 
    }, 100); 
}); 

，或者您可以使用$timeout服務和跳過$apply：

$timeout(function() { 
    $scope.colors = [ 
    {code: "#ff0000", name: "red"}, 
    {code: "#0000ff", name: "blue"}, 
    {code: "#00ff00", name: "green"}]; 
}, 100); 

但正如你說，你是使用Ajax調用，我懷疑這是你真正的問題（除非你沒有使用$http服務）。

完成這些更改後，示例中的選擇仍然不會正確選擇顏色。這是因爲ng-model="car.color"中的顏色對象和$scope.colors中的對象的相等性通過引用進行評估。所以爲了工作，他們需要引用相同的對象。

您的示例的工作版本：http://plnkr.co/edit/Nx9nPYMDgPCSVWpOrQoV?p=preview