angular Js ui router nested views

2019-12-16 20:10发布

问题:

link to example: http://goo.gl/jJBMZL

Here two states are defined. 1. home , 2. about

home has 1 view viewA

about has 2 views viewA and viewB but viewB is a sub part of about page. I want to show viewB inside of about.html page and not on index page. Is this possible. Please provide a plunkr link thanks.

what is the best practice if there are various views and each view has sub states

回答1:

You can include your page 'about-sub-level.html' inside 'about.html' using ng-include like as-

<h1>I am about page</h1>
<div ng-include="'about-sub-level.html'"> </div>

Change your routing like below-

 .state('about', {
            url: "/about",
            views: {
                "viewA": {
                    templateUrl: "about.html"
                }
            }
        })

Hope this may help you..