angularjs ui-router的使用

标签：

<div data-ui-view=""></div>

这里的data-ui-view会把

<div ui-view=""/> the ui-view directive tells $state where to place your templates, 可以添加name,autoscroll,onload属性 所以fyi.html这个就是个通用的模板， 搞清楚几个名字：state,view

比如，有一个state：名为selectedProject，的templateUrl是“selectedProject.html” 然后在selectedProject.html问价里有<div ui-view=""/>，并且有一些其他的我们想作为selectedProject子模板的公共内容的部分 .state("selectedProject.reportList", {             url: "/reportList",             templateUrl: "reportList.html",             controller: ‘totalPage‘         }) 例如state:selectedProject.reportList,因为在名字上构成了一种父子关系，所以它会拿自己的模板去渲染父模板的ui-view部分

因此，一旦想提取一些公共的部分出来，这是一种方式，缺点是它要提取个parent state出来，这样就会多一个state和对应的模板和控制器

问题一：所以，如果我们想包含一个common.html进来怎么办呢？我们不想去提取先的parent state,因为这样所有子路由都改变了。 answer: 就把common部分的内容直接加到parent模板中去

问题二：子state的URL是相对于父state的url来写的，所以如果go的地址是一个子state，那么怎么设置父state中的参数值？

href VS ui-sref: ui-sref的值可以是config的任意一个state的名字，并且可以使用相对state名字，并且后面也可以带有参数的值， 所以结合ui-router使用起来方便简单 eg:<a ui-sref="contacts.detail({ id: contact.id })">{{ contact.name }}</a>

href是通用的跳转链接，但是不认识自定义的state名字

angularjs ui-router的使用

标签：

原文地址：http://www.cnblogs.com/gaoqin-web/p/4894378.html