AngularJs-$parsers自我理解-解析

$parsers 首先先了解下它具体的作用,当用户与控制器进行交互的时候。ngModelController中的$setViewValue()方法就会被调用,$parsers的数组中函数就会以流水线的形式被一一调用。第一个$parse被调用后在进行第二个$parse调用

这些函数可以对输入值进行转换,后者通过$setValidity()函数设置表达的合法性:

这个方法可以人为的设置一个表单控件的$valid 以及$ invalid, 也就是说改变表单控件是否通过校验的状态.类似的还有$setDirty()和$setPristine().

那么具体是实现,用了一些时间做了一个突击测试,也没有花什么时间研究,有不妥也正常,但应该也差不多了

首先$parsers是view 到 model的一个过度,因此当Model不希望有所更新的时候就返回一个undefined。

其实初步看它是改变了ngModel的值,但测试会发现你在输入Input里面并没有为空,还是你输入的数,但你会发现如果它被触发了,Model里面的属性就不会更新了,所以因此当Model不希望有所更新的时候就返回一个undefined。这句话是没有问题的。它只是Model不去更新了,但你的view还是会更新的,因为我们输入的内容不还是在ng-model内么,只是他不和Model相连接了,嗯我的理解就是失去了双向绑定的特性,封闭“作用域”。

这个服务多用在指令上,那么经过测试发现只要你要用到指令了就必须加上他,即使你感觉根本没有地方调用它,但是它确实是存在那的。

如你把下面的例子ng-test  去点看看  然后加上属性不调用在看看,以及就像我就写个ng-test 看看。

那么具体什么时候是model转向view就是另一个内置服务了$formatters,那么这个其实也是$parsers执行后立即调用的服务。这就不多说了。

//HTML

<div ng-controller="TestController">

<form name="testForm">

<input type="text" name="inputs" ng-test ng-model="obj.number">

<span ng-show="testForm.inputs.$error.test">good</span>

<span ng-hide="testForm.inputs.$error.test">bad</span>

<div>{{ testForm.inputs.$valid }}</div>

<div>{{ testForm.inputs.$invalid }}</div>

<div>{{ obj.number }}</div>

</form>

</div>

//Script

<script type="text/javascript">

angular.module(‘myApp‘, [])

.controller(‘TestController‘, function($scope) {

$scope.obj = {

number: 34

};

})

.directive(‘ngTest‘, function(){

return {

require: ‘?ngModel‘,

restrict: ‘AE‘,

link: function($scope, iElm, iAttrs, ngModel) {

if(!ngModel) return;

ngModel.$parsers.push(function(viewValue){

var num = parseInt(viewValue);

if(num>=0 && num<99){

ngModel.$setValidity(‘test‘,true);

return viewValue;

}else{

ngModel.$setValidity(‘test‘,false);

return undefined;

}

});

}

};

});

</script>

时间: 2024-10-21 13:05:01

AngularJs-$parsers自我理解-解析的相关文章

Java内部类的自我理解

本文借鉴网络上多位大牛的博客和文章,感谢各位不知名人士的分享. 一.什么事内部类? 内部类是指在一个外部类的内部再定义一个类.内部类作为外部类的成员,并且依附于外部类而存在的.内部类可以为静态,可用protected和private修饰(而外部类只能使用public和缺省的包访问权限).内部类主要有以下几类:成员内部类.局部内部类.静态内部类和匿名内部类. 二.需要内部类? 典型的情况是,内部类继承自某个类或实现某个接口,内部类的代码操作创建其的外围类的对象.所以你可以认为内部类提供了某种进入其

原型(1)------------自我理解

什么是原型? 每一个js对象都和另外一个对象关联,这另外个对象就是“原型”----------js权威指南....哈???这就叫原型啊???excuse me??? 只要创建了一个新函数,就会为该函数创建一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法-----------js高级程序设计....嗯,,,,嗯????? 来创建个对象: function Person(){};  //创建函数 var person

原型(2)------------自我理解

接上一篇原型(1)------------自我理解 以下是我自己对自定义函数,内置构造函数Object().Function(),原型prototype与__proto__它们的联系的理解: Js里有许多内置的构造函数,例如:Object(),Function(),Date(),Array()等 1. 每个对象都有一个__proto__属性,该属性指向创建这个对象的函数的prototype. (这里就没管IE,直接用__proto__属性,这样好理解一点) 2. 每个函数都有一个prototyp

摘:Windows系统内存计数器理解解析_备忘录_51Testing软件测试网...

[原创]Windows系统内存计数器理解解析 2008-05-13 11:42:23 / 个人分类:性能测试 说明:本文的计数器以Windows2003为准. 序言;F9n)\%V1a6Z C)?ZV0内存的使用情况是系统性能中重要的因素之一,频繁的页交换及内存泄露都会影响到系统的性能.本文主要是描述内存的一些概念.计数器含义,以及可能存在的性能瓶颈.4Cd%l3r(T&z y051Testing软件测试网xi[8VP?r?Q?a一些概念f2c(qDw-y&{l01Vu7t|%D} r5e

Java http接口进阶——自我理解为接口框架形式

大龄青年初入Java,所以对有些专业术语的了解不是很深入,可能在写博文的时候,会有误解,望各大V能慷慨指出,感激不敬. 一.接口框架形式 接口框架如下: 形式比较简单,承接上篇的简单接口模式. 大概思路:以简单的servlet的形式做接口调用测试. bean层以@XMLRootElement注释进行bean与xml的转化. api层用来写具体需要实现的接口类,继承抽象接口类,进行数据库操作,并且返回对象. servlet层用来写每一接口来调用的servlet类. 一个bean对应一个api类对应

面向对象五大原则之一:单一职责原则(自我理解)

http://www.cnblogs.com/seacryfly/archive/2011/12/29/2305965.html 只有类对应的(唯一)职责(需求)的变更才会引起代码的重构. The single responsibility principle states that every module or class should have responsibility over a single part of the functionality provided by the so

html基本标签自我理解

HTML5课堂笔记理解2 上次忘记说了HTML5书写格式要在<html>前加上注释<! DOCTYPE HTML>告诉电脑这是HTML5文档 <h1></h1> 这是一个标题标签在页面身体左上角开始显示.标签内的数字代表字体的大小基本最小到5就可以了.HTML自动在一个标题标签前后会自己添加空行.这个标题标签也可以加入aling属性调节左.右.中. 各种格式化文字标签 <b></b>:定义粗体字 <strong></

python面向对象开发的自我理解

?详细代码理解可以参考 笨鸟教程博客:http://www.runoob.com/python3/python3-class.html 面向对象经常被提起,那到底什么是面向对象呢? 它的基本概念:类,对象.实例,属性,方法以及封装.继承.多态还有组合到底是什么呢? 对象可以是世间万物. 面向过程:它是以数据为中心,按照人的逻辑使用比如c语言代码 处理数据来完成任务的过程. 比如把大象放入冰箱内总共分三步: 第一步:打开冰箱门: 第二步:把大象放进冰箱: 第三部:关上冰箱门. 可以看出这个逻辑潜在

关于 String 自我理解

String 的一些认识: String对象是不可变,所以使用 final 修饰 字符串拼接,合理利用 StringBuilder(线程非安全),StringBuffer 线程安全 常用方法就不详细介绍 ■构造函数 public final class String implements java.io.Serializable, Comparable<String>, CharSequence { 实现 java.io.Serializable 接口,支持序列化 实现Comparable 接