发表于: 2017-05-10 23:57:26

0 886


今天完成的事情:

使用AngularJS完成了任务7登录页面的两个input框数据的双向绑定,使用的ng-model指令。

对登录button添加ng-click事件,并在controller中定义login()方法使用$http请求登录接口。

学习了angular表单验证,包括ng-show和ngMessages,并使用ngMessages为form表单添加验证功能,

验证了用户名和密码是否有填写、最大最小长度等。

登录成功后用location.href="url"使页面跳转到列表页。

明天计划的事情:

完成任务7剩余的获取列表页接口数据并用ng-repeat将数据渲染到页面上。

学习ui-router,开始任务8

遇到的问题:

中间学习ngMessages时遇到问题,表单验证提示信息无法正常显示,开始以为是script标签引入的angularjs文件版本不一致,

后来版本统一后问题还在,直到我照着书上的代码敲到var app = angular.module("myApp",["ngMessages"]);时才发现我没有在这里注入ngMessages模块。其他的还有nginx的配置也遇到过问题,比如文件路径中包含“\t”转义字符导致错误等。

收获:

学习了angularjs的数据双向绑定、ng-click事件、$http的用法、表单验证的原理和作用以及用处,主要是提高用户体验,

不用等到数据传输到服务器就能得到验证。今天的小课堂是王相博讲的angularjs的指令。

指令分为内置指令和自定义指令,内置指令有六十多种,像ng-model,ng-app,ng-controller,ng-messages都是内置指令,自定义指令则是用户使用directive()方法在scope中设置的,可以在页面中嵌入别的html页面,这一功能也可以由ng-include代替。



返回列表 返回列表
评论

    分享到