发表于: 2017-03-03 09:53:47
1 1238
完成的事情:
好吧,由于PPT的事情,昨天计划的东西基本没动,最后刚把ui-router的一点小小用法测试出来
计划的事情:
继续这个计划
使用ui-router重写路由
思考和尝试完成搜索和翻页的代码内容
问题:
那个ui-router.js在angular官网下载链接在哪里???
版本上ui-router和angular需要搭配吗?
与route相比可控属性更多,现在只能先简单使用一下,
经代码测试,同意url下,views需要同时给''和'child'赋值才能保持两个ui-view的显示,如果少了哪一个,当url满足是,少了的那个ui-view会隐藏不见,不会保持前一个url的结果。
猜测:路由的初始化程序,跟事件绑定不一样。#/xxx作为一个特定页面存在,在初始化的时候,定义了某#/xxx页面的内容,而url值下,没有的内容,被认定为该页面不存在该内容,所以不予显示。
<div ui-view></div>
<div ui-view="child"></div>
var myApp = angular.module("myApp",["ui.router"]);
myApp.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider
.state('home',{
url:'',
views:{
'':{
templateUrl:'代码测试专用2(跨页).html'},
'child':{
template:'abc'}}
})
.state('page1',{
url:'/page1',
views:{
'':{
templateUrl:'代码测试专用2(跨页).html'},
'child':{
templateUrl:'page1.html'}}
})
.state('page2',{
url:'/page2',
views:{
'':{
templateUrl:'代码测试专用2(跨页).html'},
'child':{
templateUrl:'page2.html'}}
})
.state('page3',{
url:'/page3',
views:{
'':{
templateUrl:'代码测试专用2(跨页).html'},
'child':{
templateUrl:'page3.html'}}
})
});
收获:
json和js对象的区分,{"name":value} and {name:value}
ui-router相比route的优点,例如嵌套层的使用,例如同级可路由不同路径,显示不一样的内容
评论