Javascript Angular.js:更改模板的内部视图
我有以下html页面: dashboard.htmlJavascript Angular.js:更改模板的内部视图,javascript,angularjs,ng-view,Javascript,Angularjs,Ng View,我有以下html页面: dashboard.html <div class="wrapper"> <div class="box"> <div class="row row-offcanvas row-offcanvas-left"> <dashboard-sidebar></dashboard-sidebar> <div cl
<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>
我的问题是:如果我的“主视图”模板是这样的:
<h1>Section Title</h1>
<div class="row" ui-view="blog-view"></div>
章节标题
如何更改“博客视图”上的模板?已解决!
在上,我找到了多视图的最简单和最好的解决方案
app.js
var myapp = angular.module('myapp', ["ui.router"])
myapp.config(function($stateProvider, $urlRouterProvider){
// For any unmatched url, send to /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>
- 是问题解决方案的代码示例。您在
仪表板/views/dashboard blog view.HTML
中更改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>