1、在包含路由的控制器中,注入$state
2、跳转
$state.go('state的第一个自定义名称')
代码示例:
<html ng-app="app" ng-controller="main">
<head>
<meta charset="utf-8">
<title ></title>
<script src="js/libs/angular.js"></script>
<script src="js/libs/angular.route.min.js"></script>
<script src="https://cdn.bootcss.com/angular-ui-router/1.0.25/angular-ui-router.js"></script>
<style>
.a{
color:red;
}
</style>
</head>
<body>
<div ng-controller='d1'>
<a href="#">首页</a>
<a href="#/home">home</a>
<a href="" ui-sref='movie'>movie</a>
//动态跳转
<a href="" ng-click="go('home')">跳转到home</a>
<!-- 当访问路由出错,会显示内容 -->
<div ui-view>页面不存在</div>
</div>
<script>
var app=angular.module('app',['ui.router']);
app.config(['$stateProvider','$urlRouterProvider',function($stateProvider,$urlRouterProvider){
//将'/hd'设置为默认页,打开页面自动跳转
$urlRouterProvider.otherwise('');
//创建路由
$stateProvider.state('default',{
//路径为空表示在当前页面
url:'',
template:'<h1>哈哈</h1>'
})
.state('home',{
url:'/home',
template:'<h1>home{{name}}</h1>',
//控制器
controller:['$scope',function($scope){
$scope.name='jeff'
}]
})
.state('movie',{
url:'/movie',
templateUrl:'./angular/user.html',
controller:'movieCon'
})
}])
app.controller('main',['$scope',function($scope){
}])
app.controller('d1',['$scope','$state',function($scope,$state){
$scope.go=function(url)
{
//动态跳转
$state.go(url);
}
}])
</script>
</body>
</html>
1144
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
