2014-11-25 18 views
9

"tarafından track" kullanarak ui.select angularjs nesneleri. Ben ancak aynı kaynaktan, aynı yapının nesneleri içeren, ng-modeline seçilen nesneleri geçmek ve bu benim seçeneklere eşleştirilmiş olmasını istiyorum:Haritalama ben açısal-ui en <strong><code>ui.select</code></strong> bir <code>multiple dropdown field</code> doldurmak için kullanmak isteyen

<div ng-repeat="training in trainings"> 
    <form class="form-horizontal" role="form"> 
     <ui-select multiple ng-model="training.skills" theme="select2" ng-disabled="disabled"> 
      <ui-select-match placeholder="Wähle Skills...">{{$item.name}}</ui-select-match> 
      <ui-select-choices group-by="skillTypeGrp" repeat="skill.id as skill in skills | filter: $select.search"> 
       <span>{{skill.name}}</span> 
      </ui-select-choices> 
     </ui-select> 
    </form> 
</div> 

bir ile ng-repeat den trainings liste örnek eğitim şuna benzer:

[{"type": "tech", 
    "name": "C#", 
    "id": 194}, 
{"type": "tech", 
    "name": "Java", 
    "id": 197}, 
...] 
:

[{"description": "", 
    "skills": [{"type": "tech", 
       "name": "C", 
       "id": 194}], 
    "id": 1, 
    "name": "Test"}] 

ui-select-choices My skills liste training.skills aynı veri yapısını içermektedir

Maalesef bu işe yaramıyor. Kullanıcı seçimi, boş bir seçim alanı gösteren training.skills'umu boşaltır. Angularjs, this blogpost'da belirtildiği gibi, aynı diziye sahip değilse, bu nesneleri eşleyemediğini anlıyorum. Bu nesnelerin iki listeyi eşleştirmek için kullanmak ui.select hangi özelliği anlatmak için track by kullanılmasını önerir, ancak ben hiç ui-select-choices çizgi değiştirirseniz:

<ui-select-choices group-by="skillTypeGrp" repeat="skill.id as skill in skills track by skill.id | filter: $select.search"> 

hiç bir şey değişmez. single property binding example önerileri gibi nesnelerimi kimlikleriyle değiştirmeden bunu çalıştırmanın bir yolu var mıdır?

cevap

0

Yanlış yoksa, tüm nesneyi kimliğiyle karşılaştırmaya çalışıyorsunuz.

Kullanmak denedin mi:

<ui-select-choices group-by="skillTypeGrp" repeat="skill in skills | filter: $select.search"> 
    <span>{{skill.name}}</span> 
</ui-select-choices> 

Bildirim ben tekrarından gelen "skill.id" kaldırıldı. Bence bu şekilde nesneleri karşılaştırmalı ve umarım işe yarayacaktır.

Aksi takdirde, ui-select-seçimleriniz elinizde olduğu gibi bırakılır ve ui-select'te listeyle eşleştirmek için bir dizi kimlik (seçilen eğitimler) iletilir. Tabii ki bu, her değişiklik yapıldığında beceri dizisini güncellemek için tarafınızdan daha fazla kodlama anlamına gelir.

Yardım edin.

2

Sen o iş yapmak filter ve track by ters gerekir:

<ui-select-choices group-by="skillTypeGrp" repeat="skill in skills | filter: $select.search track by skill.id"> 

Garip görünüyor, ama benim için hile yaptı ..

0

Eğer https://docs.angularjs.org/api/ng/directive/ngRepeat track by verilen belgelere bakın varsa her zaman son ifade olmalıdır. Bu çalışacak

<ui-select-choices group-by="skillTypeGrp" repeat="skill in skills | filter: $select.search track by skill.id"> 

: mADC önerdiği şekilde

Yani, değiştirirseniz.

documentation snippet that says about track by being the last expression

: Aşağıda

son ifadesi kalarak parça hakkında söylediği belgeler snippet'idir