发表于: 2017-07-05 22:10:51
1 1000
今天完成的事情:
1.今天看了大佬发给我的那篇ui-router的文章,写的确实好,简单易懂,照着写了demo也成功了
首先在HTML中引入angularJS和ui-router文件
<script src="https://cdn.bootcss.com/angular.js/1.4.12/angular.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.8/angular-ui-router.min.js"></script>
然后就是配置路由
var myApp = angular.module("myApp", ["ui.router"]);
myApp.config(function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.when("", "/PageTab");//如果没有路由引擎能匹配当前的导航状态,那它就会默认将路径路由至 PageTab.html
$stateProvider
.state("PageTab", {
url: "/PageTab",
templateUrl: "PageTab.html"
})
.state("PageTab.Page1", {//.page1子集,层级结构
url:"/Page-1",//随便取名,定义路径
templateUrl: "Page1.html"//定位到文件})
})
pagetab,page1页面是父子集关系,需要要在新开的页面中书写,新开的页面不需要包括在HTML,body中,直接写主体div内容就可以,还有尽量放在一个文件夹
2.照着这个模板,写了后台主页的路由,列表页;新增页面还没写,那是后面的任务,以后可以往里面嵌套
明天的计划:完善列表页,请求后台数据,ng-repeat渲染到列表中
遇到的问题:写列表页的时候,突然想到需要给它添加CSS样式,但是另开的页面没有HTML,body,不知道往哪里引入,请教师兄说,要用到懒加载,查找资料,又有点迷糊,任务比较赶,决定先放着,先直接在主页引入,任务写完后再去完善,lazyload说是可以提高页面渲染速度,分担主页第一次渲染的压力
收获:学会了写ui-router,知道了懒加载,虽然还不会用
评论