发表于: 2017-10-26 20:01:28
1 521
今天完成的事情:
完成表单验证,通过ng-if和ng-show的配合完成页面效果。
明天计划的事情:
传参到接口,做出上传进度条。
遇到的问题:
<div class="'form-group" ng-class="{'has-error':mycuteform.titleName.$dirty && mycuteform.titleName.$invalid}">
上面代码我的想法应该是可以让我的input框在dirty(没动过)invalid没传入值的时候has-error=true来表现出一个红色的input框,实际上却并没有效果。不知道为啥。。
收获:
1.重新看了下js原生。
数据类型和变量方面:
JavaScript允许对任意数据类型做比较:
false == 0; // true
false === 0; // false
要特别注意相等运算符==。JavaScript在设计时,有两种比较运算符:
第一种是==比较,它会自动转换数据类型再比较,很多时候,会得到非常诡异的结果;
第二种是===比较,它不会自动转换数据类型,如果数据类型不一致,返回false,如果一致,再比较。
由于JavaScript这个设计缺陷,不要使用==比较,始终坚持使用===比较。
另一个例外是NaN这个特殊的Number与所有其他值都不相等,包括它自己:
NaN === NaN; // false
唯一能判断NaN的方法是通过isNaN()函数:
isNaN(NaN); // true。
2.ng-if在表达式为false的时候会移除元素。ng-show在选中的时候显示元素。
在任务中ng-model选中的值为我们设定的值的时候就会显示出另一个select框。
3.$parsers与$formatters:
当用户同控制器进行交互,并且ngModelController中的$setViewValue()方法被调用时,$parsers数组中的函数会以流水线的形式被逐个调用。
第一个$parser被调用后,执行结果递给第二个$parse,以此类推。
这些函数可以对输入值进行转换,或者通过$setValidity()函数设置表单的合法性。
每个$parser返回的值都会被传入下一个$parser中。如果不希望数据模型发生更新undefined。
使用$parser数组可以自定义验证的途径之一。例如,假设我们想要确保输入$parsers由input的值,即用户输入的变化都会触发
其中的管道函数。它是view值到model值的转换器。model值对应的管道函数中的return值决定$formatters则和$parsers的作用相反,
它是model值到view值的转化器。其view值由对应的管道函数中的return值决定。并且要注意的一点是,在view中引起的model值的变
化并不能触发$formatters中的管道函数,只有在代码中改变model的值才会触发其管道函数。值在某两个数值之间,可以在$parsers
数值中入栈一个新的函数,这个函数会在验证链中被调用。
下面的这段代码,展示的是用户输入触发$parsers中的管道函数,引起model值的变化。和从代码中改变model的值,
触发$formatters的管道函数,从而引起view值的变化。
4.三元运算符:如名字表示的三元运算符需要三个操作数。
语法是 条件 ? 结果1 : 结果2;. 这里你把条件写在问号(?)的前面后面跟着用冒号(:)分隔的结果1和结果2。满足条件时结果1否则结果2。
<script type="text/javascript">
var b=5;
(b == 5) ? a="true" : a="false";
document.write(" --------------------------- "+a);
</script>
结果: --------------------------- true
评论