routing - AngularJS State management ->load multiple states in one page -


i developing site in angularjs ui-router. have situation on button click need change , load 3 state page , 3 looks image .please me how can load multiple pages. in 1 page

enter image description here

you need configure router config this:

$stateprovider     .state("state1", {         url: "/url1",         controller: "firstcontroller",         views: {             view1: { templateurl: "templates/template1.html" },             view2: { templateurl: "templates/template2.html" },             view3: { templateurl: "templates/template3.html" }         }     }).state("state2", {         url: "/url2",         controller: "secondcontroller",         views: {             view1: { templateurl: "templates/template4.html" },             view2: { templateurl: "templates/template5.html" },             view3: { templateurl: "templates/template6.html" }     }).state("state3", {         url: "/url3",         views: {             view1: {                  templateurl: "templates/template7.html",                 controller: "thirdcontroller"              },             view2: {                  templateurl: "templates/template8.html",                 controller: "fourthcontroller"              },             view3: {                  templateurl: "templates/template9.html",                 controller: "fifthcontroller"              }     }); 

so need provide information every view in every state: templates views use, controllers, resolves, etc. need give names ui-view containers (in example view1, view2, view3). that's how ui-router know templates , controllers needs use every view container.

and view similar this:

<section class="sidebar left">     <div ui-view="view1"></div> </section>  <section class="sidebar right login">     <div ui-view="view2"></div> </section>  <div ui-view="view3"></div> 

Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -