发表于： 2017-06-03 23:23:03
1 894
1、在任务5网页，$.ajax.success增加了一个判断实现网页的跳转。
if(data.message=="success"){location.href="./js-round6.html"};
2、完成网页布局，基本完成任务6，没有PSD对照，任务资源里面的图也比较简陋，就照着下面效果展示写的代码。右上角3个登陆状态小图标还没写，先传上来师兄看看有啥需要修改的。
3、简单说一下任务的几个关键点
$("li").eq(1).click(function(){ //自己的JS文件，侧边栏，菜单点击函数
if($(".article").is(":hidden")) {$(".article").show() } //点击显示或者隐藏
else $(".article").hide()
})
<a href="#/article" class='article'>Article列表</a> //html布局内，跳转页面，路由地址为当前url+#/article，实现不刷新页面，纯html布局样式更改。
<div class="main" ng-view=""> //html布局内，ng-view=""表示跳转链接对应的插入模块的布局位置
<a href="#/new_article"><button>+新增</button></a> //第一个页面插入模块内，新增按钮的跳转
<body ng-app="ngRouteExample"> //定义范围
模块、路由实现地址的分配：
angular.module('ngRouteExample',['ngRoute'])
.config(['$routeProvider', function($routeProvider){
$routeProvider.when('/',{templateUrl: 'welcome.html'}) //当页面链接是“/”时，插入的网页模块welcome.html，下同。
.when('/article',{templateUrl: 'article.html'})
.when('/new_article',{templateUrl: 'new_article.html'})
.otherwise({redirectTo:'/'})
}]);
困难：
1、需要加载多个js外联文件，自己js、AngularJS、公共库AngularJS、和angular-route，写法和加载顺序还不是很清楚。
2、angular-route的网页加载模块不知道怎么外联，暂时是写在html文件里面的，用id指引，明天再好好研究下。
<script type="text/ng-template" id="welcome.html">
3、AngularJS的网上资料资源不是太多，有些应用不好对应。
收获：上手angular和angular-route，主要对控制器、模块等初步应用。
计划：修改补充任务6，准备任务7。
返回列表
评论