ngModel格式化程序和解析器 [英] ngModel Formatters and Parsers

问题描述

我张贴在不同形式同样的问题，但均无人接听。我没有得到什么样的格式化程序和解析器角JS做一个清晰的画面。

I posted the same question in different form, but no one answered. I am not getting a clear picture of what the Formatters and Parsers do in angular js.

该定义，无论是格式化程序和解析器类似于我。也许我错了，因为我是新来这个angularjs。

By the definition, both the Formatters and Parsers look similar to me. Maybe I am wrong, as I am new to this angularjs.

的的功能阵列来执行，作为管道，每当模型值的变化。
每个函数被调用，反过来，使数值通过到下一个。
用于格式化/转换值，在控制和验证显示屏。的

的的函数来执行，作为管道，每当控制从DOM中读取数值数组。
每个函数被调用，反过来，使数值通过到下一个。
用于消毒/转换价值和验证。
为了验证，解析器应该使用$ setValidity（）更新有效期限状态，并为无效值返回undefined。的

请帮我理解一个简单的例子这两项功能。两者的简单例子将大大AP preciated。

Please help me to understand both features with a simple example. An simple illustration of both will be much appreciated.

非常感谢你提前。

推荐答案

这个话题覆盖很好的一个相关的问题：的如何做双向滤波angular.js？

This topic was covered really well in a related question: How to do two-way filtering in angular.js?

要总结一下：

• 格式化程序如何改变模型值会出现在视图中。


• 解析器更改视图值将如何被保存在模型中。

下面是一个简单的例子，对建设中的 NgModelController API文档一个例子：

Here is a simple example, building on an example in the 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

You can see it in action: 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" />

当你键入（视图模型）的名称，你会看到，该模型始终是小写。但是，当你点击一个按钮，编程更改名称（型号查看），输入字段始终是大写的。

When you type a name in (view to model), you will see that the model is always lowercase. But, when you click a button and programatically change the name (model to view), the input field is always uppercase.

这篇关于ngModel格式化程序和解析器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！