发表于： 2017-07-05 22:04:59
1 1027
今天主要进行了任务6。
1. 首先是页面的制作
首先是在页面内引入angular，body作为angular的作用区域
<body ng-app="theApp"></body>
在页面中引入
<div ui-view=""></div>
所有需要加载的内容都放在这里
2. 嵌套路由
根据http://www.open-open.com/lib/view/open1416878937309.html
写一个app.js
var myApp = angular.module("myApp", ['ui.router']);
myApp.config(function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.when("", "/PageTab");
$stateProvider
.state("PageTab", {
url: "/PageTab",
templateUrl: "PageTab.html"
})
.state("PageTab.Page1", {
url:"/Page1",
templateUrl: "Page-1.html"
})
.state("PageTab.Page2", {
url:"/Page2",
templateUrl: "Page-2.html"
})
.state("PageTab.Page3", {
url:"/Page3",
templateUrl: "Page3.html"
});
});
这就是一个所有页面的总目录，所以根据这种方法，根据页面内容新建对html文件，然后写一个自己的加载内容目录
3. 懒加载
引入懒加载js，在路由js里写懒加载
resolve: {
loadFile: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load([
'css/index.css',
'js/index.js'
])
}]
}
明天计划继续进行任务6，争取早日弄完
遇到的问题
懒加载还是有问题，加载了css样式和js之后，只有css能正常显示，但是js会报错，明天改一下
收获，今天学习了ui-router和懒加载的使用，但是懒加载还是有问题。
返回列表
评论