angularjs – ngModel格式器和解析器

前端之家收集整理的这篇文章主要介绍了angularjs – ngModel格式器和解析器前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我发布了同样的问题,不同的形式,但没有人回答。我没有得到一个清晰的图片格式化和解析器做的角度。

根据定义,Formatters和Parsers都与我相似。也许我错了,因为我是新的这个angularjs。

格式化定义

当模型值改变时,作为流水线执行的函数数组。
每个函数调用,反过来,将值传递到下一个。
用于格式/转换用于在控制和验证中显示的值。

解析器定义

当控件从DOM读取值时,作为流水线执行的函数数组。
每个函数调用,反过来,将值传递到下一个。
用于清理/转换值以及验证。
为了验证,解析器应该使用$ setValidity()更新有效性状态,并为无效值返回undefined。

请帮助我用一个简单的例子来理解这两个特性。将非常感谢两个简单的例子。

非常感谢你提前。

这个话题在一个相关的问题: How to do two-way filtering in angular.js?

总结:

>格式化程序更改模型值在视图中的显示方式。
>解析器改变视图值在模型中的保存方式。

这里是一个简单的例子,建立在一个例子在NgModelController api documentation

//format text going to user (model to view)
  ngModel.$formatters.push(function(value) {
    return value.toUpperCase();
  });

  //format text from the user (view to model)
  ngModel.$parsers.push(function(value) {
    return value.toLowerCase();
  });

你可以看到它在行动:http://plnkr.co/UQ5q5FxyBzIeEjRYYVGX

<input type="button" value="set to 'misko'" ng-click="data.name='misko'"/>
<input type="button" value="set to 'MISKO'" ng-click="data.name='MISKO'"/>
<input changecase ng-model="data.name" />

在(以模型形式查看)中键入名称时,您将看到模型始终为小写。但是,当您单击按钮并编程更改名称(模型以查看)时,输入字段始终为大写。

猜你在找的Angularjs相关文章