Angularjs select, eşleme modelini seçili olarak işaretlemiyor

Question

ngModel ile ilgili seçimde seçili olarak gösterme konusunda sorun yaşıyorum. Hem kimlik hem de ad eşleşiyor ancak çalışmıyor, bkz. SelectedState. Seçenekler dizisi içindeki gerçek nesneye işaretleme modeli çalışır, bkz. SelelectedState2. Hiçbir fikrim neyin

Fiddle ... oluyor: Her nesne Eğik aynı olup olmadığını belirlemek için kullandığı Açısal tarafından sağlanan kendi $hashKey var çünkü http://jsfiddle.net/fedorsmirnoff/b49n4Ldp/2/

<select ng-model="selectedState" ng-options="state.name for state in stateOptions"></select> 

<select ng-model="selectedState2" ng-options="state.name for state in stateOptions"></select> 

function MainCtrl($scope) { 
$scope.stateOptions = [ 
    {id: 1, name: "Alaska"}, 
    {id: 2, name: "Montana"}, 
    {id: 3, name: "Nebraska"}, 
    {id: 4, name: "Texas"} 
    ] 

$scope.selectedState = {id: 2, name: "Montana"}; 

$scope.selectedState2 = $scope.stateOptions[1]; 

} 

Answer 1

budur. $scope.selectedState'da yeni bir nesne (farklı bir $hashKey ile) oluşturuyorsunuz. $scope.selectedState2'da ayarladığınız yol doğru.

Ayrıca yerine state.id tarafından Açısal parçayı yapmak için track by kullanabilirsiniz nesne en $hashKey:

Eğer $ scope.selectedState, aslında bir öğesi değil, yeni bir javascript nesnesi, yaratıyor set

<select ng-model="selectedState" ng-options="state.name for state in stateOptions track by state.id"></select> 

Answer 2

$ scope.stateOptions. Bu nedenle, seçim elemanı karşılık gelen elemanı $ scope.stateOptions'dan seçmeyecekti.

Öğeleri benzersiz bir attr değerine göre seçmeniz gerekiyorsa, select ifadesindeki 'track by' öğesini kullanabilirsiniz.

Answer 3

ng-options ifadenizin sonunda state.id tarafından Track'i eklemeye çalışın.

Answer 4

Açısal takım ngSelect here belgelerinde bu sorunu belirtilen:

Not: ngModel referans değere göre değil, karşılaştırır. Bu bir dizi nesneye bağlandığında önemlidir. Bu jsfiddle'daki bir örneğe bakın.

$scope.options = [ 
    { label: 'one', value: 1 }, 
    { label: 'two', value: 2 } 
    ]; 

    // Although this object has the same properties as the one in $scope.options, 
    // Angular considers them different because it compares based on reference 
    $scope.incorrectlySelected = { label: 'two', value: 2 }; 

    // Here we are referencing the same object, so Angular inits the select box correctly 
    $scope.correctlySelected = $scope.options[1]; 

Answer 5

siz, modelin eşsiz değere sahip track by kullanmak sonra, varolan listeye referansı tutmaz model olarak bir nesne sağlıyorsanız böylece yerine özel benzersiz $$, kullanmanın hashKey, ng-options, ayarlanan ng modelini izlemek için parçada sağladığınız özelliği kullanır.

ng-options="state.name for state in stateOptions track by state.id" 

Demo

Sadece size herhangi referansa ayar ng-modelinde yararlıdır, ama aynı zamanda buna da özellikle liste yenilenmiş olur, elementler performans etkinliğinin bir hayli olduğunu kaldırılmayacak ve yeniden oluşturulmayacak, bunun yerine açısal eleman sadece mevcut öğeyi güncelleyecektir.

İşte bir very good example for this.

Answer 6

Açısal, aynı nesnelerle iki nesneyi karşılaştırmak yerine referans denetimi kullanır. Senin durumunda $ scope.selectedState2 farklı bir nesne döndürür. Genellikle, seçilen öğeyi başlatma için bir diziden bulmak için understore kullanıyorum.