2013-04-30 17 views
5

Zacząłem używać angularjs w projekcie. Mam quest. Mam poniższy kod HTMLAngularjs Wybierz opcję Wybrane domyślne

<div> 
<label for="lastname">Bank Name :</label> 
<select ui-select2 ng-model="bank.id"> 
    <option></option> 
    <option ng-repeat="bank in banks" value="{{bank.id}}">{{bank.text}}</option> 
</select> 
</div> 

I iterację wszystkich banków na liście rozwijanej. Użytkownik wybiera i naciska ZAPISZ. Poprawiłem identyfikator i zapisałem go w DB. Gdy użytkownik wróci, nie mogę ustawić wartości rozwijanej na tę, którą wybrał. Robię to w controller.js

$http.get('/AdServerLongTail/api/user'). 
success(function(data, status, headers, config) { 
    if(status == 200){ 
     $scope.id = (data["id"]);// user id     
     $scope.bank.id = (data["bankId"]);     
    } 
}). 
error(function(data, status, headers, config) { 
    alert("fail"); 
}); 

Jak mogę ustawić go bankID 11 letssay, czyli XX Banku?

Odpowiedz

15

NIE powinieneś używać powtórzenia w ten sposób. Proszę spojrzeć na ngOptions http://docs.angularjs.org/api/ng.directive:select

+2

Dlaczego? ui-select2 nie działa z opcjami ng. – shapeshifter

+0

Słyszę cię. Ale to, że biblioteka zewnętrzna go nie obsługuje, nie oznacza, że ​​jest poprawna. – Lander

+4

@Lander, zgadzam się, że to nie jest poprawne, ale niestety jest to jedyny sposób na użycie select2. Możesz znaleźć coś innego lub zachować to w ten sposób. Proponuję napisać lepszą dyrektywę, aby uzyskać dostęp do s2, ponieważ ideą dyrektyw jest zapewnienie API bez ujawniania sposobu, w jaki działa wewnętrznie. W idealnym świecie dyrektywa API powinna działać z ng-select. Używanie ng-repeat niczego nie złamie, a ja nie uznałbym tego za hack. To, co przeszkadza mi bardziej, to że selekcja2 może być strasznie powolna w kanciastym. –

2

Znalazłem, tak łatwo, jak to przegapiłem. Oto poprawny kod.

+0

Czy można to zrobić bez interfejsu Angular UI? Ja też nad tym pracuję. – elliottregan

+0

Używanie powtórzeń zagnieżdżonych w opcjach powoduje problemy i nie działa prawidłowo z regularnym wiązaniem kątowym. Zajęło mi trochę czasu, aby dowiedzieć się, dlaczego ta technika spowodowała zawieszenie innych urządzeń Angular db ... – taudep

+0

Proszę oznaczyć inną odpowiedź jako poprawną. – uriDium

8

Jestem nowy dla kanciasty i walczył o to trochę. Oto prosty tag, który robi to, i to jest NG-Akcja:

<option ng-repeat="bank in banks" value="{{bank.id}}" ng-selected="'11' == bank.id" >{{bank.text}}</option> 

Ale znowu: Dont zrobić to w ten sposób, zgodnie z zaleceniem Lander. Zamiast tego użyj ng-options w <select>. Inaczej będzie w końcu z pustym pierwszej opcji w dropdown.assign bank.selected.id w modelu. (Tutaj w przypadku NG-modelu jest bank.id.)

<select ng-model="bank.selected.id" ng-change="someAngularfunction()" ng-options=" (''+bank.id) as (bank.id +' - '+ bank.text) for bank in banks"> 
        <option value="">Select one</option> 
</select> 

Należy również pamiętać, że wartość opcji nie pokaże bank -id w opcjach, zamiast tego pokaże wartość opcji = "0" lub "1" lub "3", czyli indeks. Ale wybrana wartość w liście rozwijanej będzie związana z modelem bank.selected.id. Na przykład, jeśli wybrana zostanie opcja dropdown, jak na przykład bank.id = 11 (XX Bank), bank.selected.id zostanie ustawiony jako "11".

Powiązane problemy