2013-10-21 11 views
5

W aplikacji z jedną stroną, czy istnieje sposób przełączania się do trasy AngularJS i wyświetlania jej w tym samym stanie, co wcześniej?AngularJS: zapamiętywanie stanu/konfiguracja złożonych widoków z trasami

Zwykle byłoby to realizowane przez wiązanie danych w zakresie nadrzędnym. Chociaż jest to łatwe do skonfigurowania dla widoku lekkiego, może być uciążliwe, gdy robi to dla widoków zawierających wiele elementów graficznych.

Oto przykład, gdzie po poprzedni stan trasa pamiętał mogłyby poprawić doświadczenia użytkownika: na następnej stronie, wyobraź sobie, że

  • stoisz na pozycji 1, a następnie wybierz kartę 2
  • następnie przejść do pozycji 2
  • wreszcie powrócić do punktu 1: Tab 2 nie wybrano już :-(

http://angular-route-segment.com/src/example/#/section1/1

Wygląda na to, że widoki są niszczone/konstruowane podczas przełączania między trasami.

Rozwiązaniem byłoby o przechowywaniu stan interfejsu użytkownika w zakresie macierzystego, ale ma ona następujące pułapek:

  • tworząc obiekt przechowywania wszystkie szczegóły interfejsu użytkownika
  • tworzenia kompleksu logika o -saving i- resetowania UI w takim samym stanie jak przed
  • przechowywania stanu UI w modelu danych nie brzmi, że MVC-owski

Korzystanie pokaz/hide z div przechowujące widoki zapisuje stan, ale wtedy nie jest używana żadna trasa, a działalność przełączania musi być realizowana ręcznie. Lubię korzystać z tras, ponieważ 1. nawigacja historii przeglądarki (hash w adresie URL) i 2. jest łatwa do skonfigurowania.

Brak informacji o stanie interfejsu jest taki sam, jak przy przeładowaniu stron przez przeglądarkę Chrome między kartami: niezbyt przyjazny dla użytkownika.

Czy istnieje sposób kątowy?

Odpowiedz

1

Twoje podejście $ routeSegment jest bardzo interesujące. Usługa $ routeSegment mógł podłączyć do zdarzenia $ routeChangeStart w celu

  • jakoś zachować „sub historię ścieżki” na wszystkich ścieżkach widziałem tak daleko, być może tylko dla tych, którzy jawnie skonfigurowane, aby utrzymać swój stan UI. W twoim przykładzie ścieżki "/ section1/1" zapisana ścieżka podrzędna byłaby "/ Y", gdyby wybrano zakładkę 2. Sprawy stają się interesujące, ponieważ mogą być również potrzebne ścieżki dynamiczne z $ routeParams.
  • Ta historia służy do przekierowania za pomocą $ location.path w module obsługi zdarzeń. Zatem zdarzenie $ routeChangeStart z next.originalPath jest "/ section1/1" może zostać przekierowane na "/ section/1/Y"
Powiązane problemy