javascript - Angular.js: change internal view of a template -


i have html pages:

dashboard.html

<div class="wrapper">         <div class="box">             <div class="row row-offcanvas row-offcanvas-left">                 <dashboard-sidebar></dashboard-sidebar>                 <div class="column col-sm-10 col-xs-11" id="main">                     <div class="padding" ui-view="main-view"></div>                 </div>             </div>         </div>     </div> 

with change template on "main-view" element:

angular.module("gecodashboard", ["gecodashboardgui", "gecodashboardhome", "gecodashboardblog", "ui.router"]) .config(function ($stateprovider, $urlrouterprovider) {     $urlrouterprovider.otherwise('/');     $stateprovider         .state('home', {             url: '/',             views: {                 'main-view': {                     templateurl: 'dashboard-home-view.html',                 }             },             title: "home"         })         .state('blog', {             url: '/blog',             views: {                 'main-view': {                     templateurl:dashboard/views/dashboard-blog-view.html',                 },             },             title: "articoli"         }) }) .run(['$location', '$rootscope', function ($location, $rootscope) {     $rootscope.$on('$statechangesuccess', function (event, tostate, toparams, fromstate, fromparams) {         if (tostate.hasownproperty('title')) {             $rootscope.title = tostate.title;         }     }); }]); 

my question is: if template on "main-view" this:

<h1>section title</h1> <div class="row" ui-view="blog-view"></div> 

how can change template on "blog-view"?

solved! on this link found easiest , best solution multiple view.

app.js

var myapp = angular.module('myapp', ["ui.router"]) myapp.config(function($stateprovider, $urlrouterprovider){      // unmatched url, send /route1     $urlrouterprovider.otherwise("/route1")      $stateprovider       .state('route1', {           url: "/route1",           templateurl: "route1.html"       })       .state('route1.list', {           url: "/list",           templateurl: "route1.list.html",           controller: function($scope){             $scope.items = ["a", "list", "of", "items"];           }       })      .state('route2', {         url: "/route2",         templateurl: "route2.html"     })       .state('route2.list', {           url: "/list",           templateurl: "route2.list.html",           controller: function($scope){             $scope.things = ["a", "set", "of", "things"];           }       }) }) 

index.html

<div class="navbar">   <div class="navbar-inner">     <a class="brand" href="#">quick start</a>     <ul class="nav">       <li><a ui-sref="route1">route 1</a></li>       <li><a ui-sref="route2">route 2</a></li>     </ul>   </div> </div>  <div class="row">   <div class="span12">     <div class="well" ui-view></div>           </div> </div> 

here code sample solution of problem.


Comments

Popular posts from this blog

python - pip install -U PySide error -

arrays - C++ error: a brace-enclosed initializer is not allowed here before ‘{’ token -

cytoscape.js - How to add nodes to Dagre layout with Cytoscape -