<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
.nav>a.active{
color: red;
}
</style>
</head>
<body ng-app="app">
<div class="nav">
<a ui-sref="router1" ui-sref-active="active">router1</a>
<a ui-sref="router2" ui-sref-active="active">router2</a>
</div>
<ui-view></ui-view>
<script src="//cdn.bootcss.com/angular.js/1.5.8/angular.min.js"></script>
<script src="//cdn.bootcss.com/angular-ui-router/0.3.2/angular-ui-router.js"></script>
<script>
var app = angular.module('app',['ui.router']);
app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider){
$stateProvider
.state({
name: 'router1',
url: '/router1',
template: '<h1>这是router1的内容</h1>'
// templateUrl: 'router1.html'
})
.state({
name: 'router2',
url: '/router2',
template: '<h1>这是router2的内容</h1>'
// templateUrl: 'router2.html'
});
$urlRouterProvider.otherwise('/router1');
}])
</script>
</body>
</html>
272
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
