Angular ui-router的常用配置参数详解

时间:2024-10-28 21:04:44

一、$urlRouterProvider服务

$urlRouterProvidfer负责监听$location,当$location变化时,$urlRouterProvider将在规则列表中查找匹配的值。

1.$location是对window.location的封装。

2.otherwise(rule)定义当请求无效时的路径跳转

二、$state服务

$state服务是负责代表状态以及提供状态之间的装换,它还能提供你当前以及上一个的状态。

1.方法:go(to,params,options)

三、$stateProvider服务

处理路由状态的服务,路由状态反应的是在应用程序中的位置,描述当前状态下的视图,并且将要做什么。

state:注册一个状态,并给定其配置。

主要参数:name,stateConfig两个

stateConfig主要是以下属性

console.log($state.href())template: string/function,html模板字符串,或者一个返回html模板字符串的函数。
templateUrl:string/function,模板路径的字符串,或者返回模板路径字符串的函数。
controller:string/function,新注册一个控制器函数或者一个已注册的控制器的名称字符串。
parent:string/object,手动指定该状态的父级。
resolve:object,将会被注入controller去执行的函数,<string,function>形式。
url:string,当前状态的对应url。
views:object,视图展示的配置。<string,object>形式。

四、ui-sref

一种将连接绑定到一个状态的指令,点击该连接将触发一个可以带有可选参数的状态转换

<a ui-sref="app.index">首页</a>
<!-- 这里是正常的跳转 -->
<a ui-sref="app.index({id:yourId})">你的主页</a>
<!-- 这里是带参数对象的跳转,名称是id,值是yourId -->