世界只因有你2017-05-15 16:59:47
用ui-router
<!doctype html>
<html ng-app="myApp">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<link rel="stylesheet" type="text/css" href="bootstrap.css" media="all">
<script src="angular.min.js"></script>
<script src="angular-ui-router.min.js"></script>
</head>
<body>
<p class='container'>
<a ui-sref="state1">State 1</a>
<a ui-sref="state2">State 2</a>
<p class="row">
<p class="span12">
<p class="well" ui-view></p>
</p>
</p>
</p>
<script type="text/javascript">
var myApp = angular.module('myApp', ['ui.router']);
myApp.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise("/state1");
$stateProvider
.state('state1', {
url: "/state1",
templateUrl: "partials/state1.html"
})
.state('state1.list', {
url: "/list",
templateUrl: "partials/state1.list.html",
controller: function($scope) {
$scope.items = ["one","two"];
}
})
.state('state2', {
url: "/state2",
templateUrl: "partials/state2.html"
})
.state('state2.list', {
url: "/list",
templateUrl: "partials/state2.list.html",
controller: function($scope) {
$scope.things = ["three",'four'];
}
});
});
</script>
</body>
</html>