設置所選項目選擇的選項

Question

在我離子項目中，我有一個<select>像這樣：

<select ng-model="user.bloodType" ng-options="x as x.description for x in formData.bloodTypes"></select> 

所以要澄清，user.bloodType是一個對象，看起來像這樣：

{ 
    'id' : 1, 
    'description' : 'O+' 
} 

formData.bloodTypes包含數組以上描述的bloodType對象。所以問題來了 - 我知道user.bloodType絕對是formData.bloodTypes中的一個對象。我怎樣才能將<select>設置爲user.bloodType是預選的？

Answer 1

如果你不使用參考平等ngModel設置的選項，你可以依靠使用track by表達基於ID平等（ID應該是每個選項是唯一的）：

ng-options="x as x.description for x in formData.bloodTypes track by x.id" 

然後你的ngModel user.bloodType可以被初始化爲一個參考不一定匹配的模型。

例如：

<select ng-model="selectedOption" ng-options="x 
      as x.description for x in bloodTypes track by x.id> 

控制器：

app.controller('ctrl', function($scope) { 
    $scope.bloodTypes = [ 
     {'id' : 1, 'description' : 'O+'},   
     {'id' : 2, 'description' : 'A'}, 
     {'id' : 3, 'description' : 'B'}, 
    ]; 

    // set initial selected option to blood type B 
    $scope.selectedOption = {'id' : 3, 'description' : 'B'}; 
}); 

或者，如果你想保留參考平等，你不要需要跟蹤：

app.controller('ctrl', function($scope) { 
    $scope.bloodTypes = [ 
     {'id' : 1, 'description' : 'O+'},   
     {'id' : 2, 'description' : 'A'}, 
     {'id' : 3, 'description' : 'B'}, 
    ]; 

    // set initial selected option to blood type B 
    $scope.selectedOption = $scope.bloodTypes[2];  
});