2014-07-22 17 views
7

Mam metodę w moim obiektu zasobów, które przychodzi jako:ng-model i ng-opcje nie pasują do?

resources.type

otherstuff: 'more strings' 
type:'specifictype' 
morestuff: 'morestuff' 

użytkownik może zmienić ten typ z listy rozwijanej/za pośrednictwem innego połączenia, który pobiera listę wszystkich możliwych typów który wygląda resourceList.types który posiada listę obiektów jak ten json

types: 
    [ 
     {name:'resourcetype1'}, 
     {name:'resourcetype2'}, 
     etc... 
    ], 

mój html wygląda następująco:

<select ng-model="resources.type" ng-options="name.name for name in resourceList.types"> 
</select> 

Pole wyboru/rozwijania wypełnia zapełnianie zasobami resourceList.type, ale po załadowaniu strony model ng nie ustawia się na już wybrany typ zasobu. To faktycznie wybiera pusty wpis u góry listy rozwijanej po kliknięciu. Czy jest na tym kanciasty? Jak mogę zmusić model ng do zachowania się tak, jak tego chcę?

Próbowałem bawić się z opcjami ng różnymi sposobami uzyskania powtórzenia, ale mam wrażenie, że jest to bardziej, jak kątowe łączy model. Czy pasuje on tylko do łańcucha do listy opcji ng?

Oto plnkr jak widać to nie stawili się do typu 1

http://plnkr.co/edit/NyWACtFQuyndR6CG8lpN?p=info

+0

Przykro mi, że mam problem ze zrozumieniem twojej architektury i tego, na czym polega problem. Czy możesz dostarczyć Plunkera, aby zademonstrować problem? – JeffryHouser

+0

Mówiąc prościej, chcę, aby cokolwiek ng-model był domyślny, ustaw listę rozwijaną na cokolwiek, co jest w zasobie resourceList.types w opcjach ng. Czy to ma sens? – Garuuk

Odpowiedz

6

W kątowa, model jest jedynym źródłem prawdy.
Oznacza to, że jeśli chcesz wybraną wartość (i związany z Twoim ngModel) należy przypisać go do modelu

<select ng-model="resources.type" 
     ng-options="type.name as type.name for type in resourceList.types"> 
</select> 

$scope.resources = {...}; 
$scope.resourceList = { 
    ... 
    types: [ 
     {name: 'resourcetype1'}, 
     {name: 'resourcetype2'}, 
     ... 
    ] 
}; 

// Set the model to the desired value 
$scope.resources.type = $scope.resourceList.types[0].name; 

Patrz także ten short demo.

+0

Tak, próbowałem tego i łamie widok Oto pnkr http://plnkr.co/edit/NyWACtFQuyndR6CG8lpN?p = info – Garuuk

+0

@Garuuk: Miałeś literówki w swoim plunkr i musisz zmienić wyrażenie 'ngOptions'. Spójrz na moją zaktualizowaną odpowiedź. – gkalpak

+0

Ahh, dotknij mojego przyjaciela dzięki, że działa. – Garuuk

2

Nie trzeba ustawiać wartości modelu dla obiektu odniesienia w resourceList. W rzeczywistości zaakceptowana odpowiedź działa poprawnie bez tej linii:

$scope.resources.type = $scope.resourceList.types[0].name; 

Jak to działa? Dzięki zapisowi "as" w ngOptions. Bez "as" dopasowanie zostanie wykonane na pełnym typie elementu, który jest obiektem, więc dopasowanie jest dokonywane na obiekcie odniesienia, a nie na wartości nazwy. W przypadku "as" następuje dopasowanie właściwości elementu, imienia i nazwiska.

Mam rozwidlony na plunker: http://plnkr.co/edit/kORfxGdsWBUlFWHXp6Ry?p=preview

1

w moim przypadku to nie działał od ngOptions był tablicą liczb całkowitych, a ja starałem się ustawić ngModal do typu string (2W 2014 roku).

Rozwiązanie jest proste: parseInt function