2012-05-07 12 views
6

W moim widoku, mam knockoutjs ObserableArray. Zaraz po zainicjowaniu ViewModel, pomyślnie wiąże dane. To, co muszę zrobić, to posortować kolekcję.knockoutjs ObservableArrays i funkcja sortowania: interfejs użytkownika nie jest aktualizowany

$.each(vm.searchResults(), function (i, property) { 
    console.log(property.Name()); 
}); 

vm.searchResults().sort(function (a, b) { 
    return a.Name().toLowerCase() > b.Name().toLowerCase() ? 1 : -1; 
}); 

$.each(vm.searchResults(), function (i, property) { 
    console.log(property.Name()); 
}); 

Jak widać, wysyłam nazwę elementu do konsoli, aby zobaczyć kolejność przed i po sortowaniu. Sortowanie działa dobrze. Problem dotyczy aktualizacji interfejsu. W jakiś sposób interfejs użytkownika nie jest aktualizowany.

Następnie spróbuj usunąć rekord z tablicy z poniższego kodu, aby sprawdzić, czy interfejs będzie reagował na to, czy nie:

vm.searchResults().shift(); 

UI pozostaje taka sama i nie aktualizować ponownie. Jaki byłby problem?

Edit:

Oto przykładowy przypadek także: http://jsfiddle.net/tugberk/KLpwP/

Ten sam problem również tutaj.

Edit:

I rozwiązać problem, jak pokazano w tym przykładzie: http://jsfiddle.net/tugberk/KLpwP/16/ Ale nadal nie wiem, dlaczego to działało jak próbowałem na początku.

Odpowiedz

18

Rozpakowujesz tablicę obserwowalną, kiedy chcesz ją posortować. To powoduje problem, ponieważ KO nie może śledzić tablicy została zmieniona. ko.observableArray() ma funkcję sort z tym samym podpisem i powiadomi subskrybentów obserwujących, że został zmieniony. Rozwiązanie jest bardzo proste: usuń nawiasy klamrowe vm.searchResults().sort =>vm.searchResults.sort. Do kasy mój przykład: http://jsfiddle.net/RbX86/

Kolejny sposób na poinformowanie KO, że tablica ma zmiany - zadzwoń pod valueHasMutated po manipulacjach z tablicą. Przejrzyj ten przykład: http://jsfiddle.net/RbX86/1/ To podejście jest bardzo dobre, gdy musisz wprowadzić wiele zmian w swojej tablicy i chcesz odświeżyć interfejs tylko raz.

Powiązane problemy