Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>According to the ui-router <a href="https://github.com/angular-ui/ui-router/wiki/Nested-States-&amp;-Nested-Views" rel="nofollow">documentation</a>, when the application is in a particular state—when a state is "active"—all of its ancestor states are implicitly active as well. So, for example, when the "contacts.list" state is active, the "contacts" state is implicitly active as well, because it's the parent state to "contacts.list". Child states will load their templates into their parent's ui-view. I'd reccomend looking over the section of their <a href="https://github.com/angular-ui/ui-router/wiki/Nested-States-&amp;-Nested-Views" rel="nofollow">documentation</a> entitled <strong>Nested States &amp; Views</strong> to gain a fuller understanding of how to do this.</p> <p>In the code you have provided us here, the parent state of the search template is <code>home</code>, while</p> <pre><code>.state('header.search', { templateUrl: "views/search.html", controller: "SearchCtrl" }) </code></pre> <p>implies that the parent state of the search template should be <code>header</code> in order for the view to get loaded correctly. So, I believe the following changes to your app.js will fix your issue.</p> <p>app.js</p> <pre><code>$stateProvider .state('home', { url: "/", views: { '': { templateUrl: "views/mainContent.html", controller: "MainCtrl" }, 'header': { templateUrl: "views/header.html" }, 'footer': { templateUrl: "views/footer.html" }, } }) .state('home.search', { views: { 'search': { templateUrl: "views/search.html", controller: "SearchCtrl" } }) .state('anotherPage', { url: "/anotherPage", templateUrl: "views/anotherPage.html" }); </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

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