2013-02-07 19 views
7

ng-modelinin ng-repeat içinde nasıl kullanılacağını anlamakta zorlanıyorum. Bu bağlamda, CargoItems, üzerlerinde LoadPoint bulunan nesnelerin bir listesidir. LoadPoint, Id ve Metin özelliklerine sahiptir.Angular.js: ng-yineleme içinde ng-modelini kullanma

Metni, açılır listeden geçerli seçime bağlı olarak göstermek istiyorum, ancak aynı zamanda, hangi kimliğin dersten seçildiğini de izlemek istiyorum. Bu yüzden, her iki özelliği de özellikli etiketlerle, ya da henüz tam olarak anlamadığım ng-options'ları kullanarak seçme bağları ile nasıl güncelleyeceğimi bilmiyorum.

Yani iki soru:

1) nasıl düzgün benim CargoItem.LoadPoint üzerinde Kimliği ve Metin özelliklerine seçme listeden metin ve değer hem bağlama mı? Benim modelimin yanlış olabileceğini hissediyorum.

2) ng-seçeneklerini seçilen değere varsayılan olarak nasıl kullanırım? Bunu kendi seçenek etiketimi yazarken buldum, ancak mümkünse ng-options kullanmak istiyorum.

<div ng-repeat="cargoItem in cargo.CargoItems"> 
    <span>Selected Load Point: {{cargo.LoadPoint.Text}}</span> 
    <select ng-model="cargoItem.LoadPoint" ng-options="loadPoint.Id as loadPoint.Text for loadPoint in LoadPoints"></select> 
</div> 

Şimdiden teşekkürler!

cevap

13
  1. 'Id' özelliğini kullanmak yerine (loadPoint.Id) tüm nesne başvurusuna bağlanın. Bunu yapmak için, sadece ng-options değiştirip loadPoint.Id as bölümünü kaldırın:

    <select ng-model="cargoItem.LoadPoint" ng-options="loadPoint.Text for loadPoint in LoadPoints"></select> 
    
  2. Yukarıdaki yaklaşım ve LoadPoints nesne Doğru referans kullanırsanız, Eğik sizin için otomatik yapacak. tüm LoadPoints (yani { Id: '1', Text: 'loadPointA' }) nesne daima bir başvuru yapacak bu yaklaşımı, cargoItem.LoadPoint (ngModel) kullanarak

    $scope.LoadPoints = [{ Id: '1', Text: 'loadPointA' },{ Id: '2', Text: 'loadPointB' }];   
    $scope.cargo = { 
        CargoItems: [{ 
         LoadPoint: $scope.LoadPoints[0] 
        }, { 
         LoadPoint: $scope.LoadPoints[1] 
        }] 
    }; 
    

    ve sadece onun Kimliği (: İşte direkt LoadPoints nasıl kullanılacağına ilişkin bir örnek referans nesnesi var yani '1').

jsFiddle: http://jsfiddle.net/bmleite/baRb5/

+0

Mükemmel, çok teşekkürler! – Sounten