发表于: 2017-08-01 22:40:25
1 899
今天完成的事情:
1、完成任务五。
2、学习了angular的基本指令和控制器。
3、学习了void属性。
明天计划的事情:
1、开始任务六,继续学习angular的基础部分。
遇到的问题:
1、本来是根据后台返回的“密码错误”,“用户名不存在”等信息,写好html,并根据各项信息匹配控制相应的display。本打算是通过
document.getElementById("use1").setAttribute("display","block");
进行控制,但不能实现效果,后来根据师兄指导,改为document.getElementById("use1").style.display = "block";
2、本准备用if..else if..来写最后的提醒信息,但实践起来发现,虽然能达成效果,但代码太冗余,而且容易写错,因此直接创建一个div标签,并将其与后台的值相结合是最省心的方法。
收获:
1、发现并学习了void属性,可以在任务四中应用,即保留链接的样式,页面不动,只打开链接。有点接近于ajax的局部刷新的感觉。下面是详细的定义。
href=”javascript:void(0);”这个的含义是,让超链接去执行一个js函数,而不是去跳转到一个地址,
而void(0)表示一个空的方法,也就是不执行js函数。
为什么要使用href=“javascript:void(0);”
javascript:是伪协议,表示url的内容通过javascript执行。void(0)表示不作任何操作,这样会防止链接跳转到其他页面。这么做往往是为了保留链接的样式,但不让链接执行实际操作,
<a href="javascript:void(0)" onClick="window.open()"> 点击链接后,页面不动,只打开链接
<a href="#" onclick="javascript:return false;"> 作用一样,但不同浏览器会有差异。
2、AngularJS是一个基于MVC处理模式,实现了MVVM数据双向绑定的用于开发动态web项目的框架。以其数据和展现分离、MVVM、MVC、DI等强大的特性活跃于前端开发市场,是前端敏捷开发使用的主流的必须掌握的框架之一。
3、AngularJS的核心之一就是控制器部分,主要对于视图中的数据和事件处理函数进行挂载,同时进行一定的业务功能的底层封装和处理。
控制器在angularjs中的作用
通过$scope进行数据状态的初始化操作
通过$scope进行事件处理函数的挂载操作
注意:不要使用控制器做下面的事情
DOM操作:使用Angularjs中的数据双向绑定和自定义指令执行操作
表单处理:使用Angular中的form controls进行操作
数据格式化展示:使用Angular中的过滤器Filter来进行操作
不同控制器之间的数据共享:使用Angular中的自定义服务Service进行处理
组件生命周期的操作:使用Angular中的自定义服务Service进行处理
代码:控制器语法结构
var app = angular.module(“myApp”, []);
app.controller(“myCtrl”, function($scope) {
// 控制器函数操作部分
// 控制器主要进行数据的初始化操作和事件函数的定义
});
控制器中的参数$scope,这个参数不需要赋值,angular会自动给$scope参数传递一个数据进行使用。
4、Angular常见的内置指令(directive)
指令:就是扩展了HTML的基本功能,通过额外的标签、属性来增强HTML功能
Angular的指令在页面中体现出来就是一个标签\属性\class名称\注释等等
常见指令,按照指令的功能,划分为五大类
1.控制指令,用于Angular应用程序加载流程控制
2.渲染指令,用于Angular将数据在网页中进行展示/隐藏处理
3.节点指令,用于Angular对标签、属性、样式、内容进行处理的指令、
4.事件指令,用于处理常规事件操作的指令
5.其他指令....
评论