Databases
StackOverflow2013
Postsdbo
POHow do I setup nested views in AngularJS?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I setup nested views in AngularJS?
    primarykey
    data
    text
    <p>I have an application with various <em>screens</em>. Each screen is assigned a URL, such as <code>#</code>, <code>mails</code>, <code>contacts</code>, and so on.</p> <p>In my main HTML file I have an <code>ng-view</code> element which updates according to the route the user selects. So far, so good.</p> <p>Now some of these screens have a sub-navigation. E.g., <code>#mails</code> 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.</p> <p>When you navigate to <code>#mails</code>, it shall redirect you to <code>#mails/inbox</code>, so that basically <em>inbox</em> is the default sub-view for mails.</p> <p>How could I set this up?</p> <p>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 <code>#mails/inbox</code>, and the other for <code>#mails/sent</code>.</p> <p>When you select a route, these views are loaded. When you select <code>#mails</code> it simply redirects you to <code>#mails/inbox</code>.</p> <p>But this means that both views must use an <code>ng-include</code> for the sub-navigation. Somehow this feels wrong to me.</p> <p>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.</p> <p>How would I solve this?</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USGolo Roden
    plurals
    1. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow do I setup nested views in AngularJS?
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POHow do I setup nested views in AngularJS?
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POHow do I setup nested views in AngularJS?
      1. This table or related slice is empty.
      1. VTUpMod
    1. COAs far as I know, there is no alternative to using ng-include as of now. That may change in the future.
      singulars
      1. POHow do I setup nested views in AngularJS?
      1. USfinishingmove
    2. COTake a look at [AngularJS - Complex nesting of partials and templates](http://stackoverflow.com/questions/12863663/angularjs-complex-nesting-of-partials-and-templates) and check out [Angular ui-route](https://github.com/angular-ui/ui-router).
      singulars
      1. POHow do I setup nested views in AngularJS?
      1. USStewie
    3. COYep, @Stewie is right. `ng-swith` is right approach for now
      singulars
      1. POHow do I setup nested views in AngularJS?
      1. USDmitry Evseev
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload