I have an application with various screens. Each screen is assigned a URL, such as #
, mails
, contacts
, and so on.
In my main HTML file I have an ng-view
element which updates according to the route the user selects. So far, so good.
Now some of these screens have a sub-navigation. E.g., #mails
does have an inbox and a sent folder. They present themselfes with two columns: The sub-navigation on the left, the mails of the appropriate folder on the right.
When you navigate to #mails
, it shall redirect you to #mails/inbox
, so that basically inbox is the default sub-view for mails.
How could I set this up?
The only approach I can currently think of (I am quite new to AngularJS, hence forgive me if this question is a little bit naive) is to have two views, one for #mails/inbox
, and the other for #mails/sent
.
When you select a route, these views are loaded. When you select #mails
it simply redirects you to #mails/inbox
.
But this means that both views must use an ng-include
for the sub-navigation. Somehow this feels wrong to me.
What I'd like more is to have nested views: The top one switches between screens such as mails, contacts, and so on, and the bottom one changes between sub-views such as inbox, sent, and so on.
How would I solve this?
question from:
https://stackoverflow.com/questions/15460279/how-do-i-setup-nested-views-in-angularjs 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…