Jak skonfigurować zagnieżdżone widoki w AngularJS?

Mam aplikację z różnymiekrany. Każdy ekran ma przypisany adres URL, na przykład#, mails, contacts, i tak dalej.

W moim głównym pliku HTML mamng-view element, który aktualizuje się zgodnie z trasą wybraną przez użytkownika. Jak na razie dobrze.

Teraz niektóre z tych ekranów mają pod-nawigację. Na przykład.,#mails ma skrzynkę odbiorczą i folder wysłany. Prezentują się w dwóch kolumnach: Pod-nawigacja po lewej stronie, maile odpowiedniego folderu po prawej stronie.

Kiedy nawigujesz do#mails, przekieruje cię do#mails/inbox, więc w zasadziew pudełku to domyślny pod-widok wiadomości e-mail.

Jak mogłem to ustawić?

Jedyne podejście, o którym mogę obecnie pomyśleć (jestem całkiem nowy w AngularJS, więc wybacz mi, jeśli to pytanie jest trochę naiwne), to mieć dwa widoki, jeden dla#mails/inbox, a drugi dla#mails/sent.

Po wybraniu trasy te widoki są ładowane. Po wybraniu#mails po prostu przekierowuje cię do#mails/inbox.

Ale to oznacza, że ​​oba widoki muszą używaćng-include dla pod-nawigacji. Jakoś mi się to nie podoba.

To, czego chciałbym więcej, to zagnieżdżone widoki: Górny przełącza między ekranami takimi jak maile, kontakty itd., A dolny zmienia między widokami podrzędnymi, takimi jak skrzynka odbiorcza, wysłana i tak dalej.

Jak mam to rozwiązać?

questionAnswers(2)

yourAnswerToTheQuestion