获取＆QUOT; RAW＆QUOT;从无效的输入字段值 [英] Get "raw" value from invalid input field

问题描述

我在与一些验证一个表单的输入域。它的工作原理就像一个魅力。

I have an input field in a form with some validations. It works like a charm.

它基本上是这样的：

<input
  class="form-control"
  type="number"
  ng-model="zipcode"
  ng-minlength="5"
  ng-maxlength="5"
  id="zipcode"
  name="zipcode"
  required
>

一个工作plunkr是在这里：<一href=\"http://plnkr.co/edit/H0h59kG75T5MGE9cAhSo?p=$p$pview\">http://plnkr.co/edit/H0h59kG75T5MGE9cAhSo?p=$p$pview

A working plunkr is here: http://plnkr.co/edit/H0h59kG75T5MGE9cAhSo?p=preview

但现在我也想应对每一个输入的变化 - 无论有效与否。因此，例如，如果输入字段包含123，它是无效的并且该值不被转移到我的模型 - 多数民众赞成细。但是，我仍然希望得到的数值做一些中间请求到web服务。

But now I also want to react to every input change - whether valid or not. So for example if the input field contains "123" it is not valid and the value is not transferred to my model - thats fine. But I still want to get the value to do some intermediate requests to a webservice.

任何想法？

推荐答案

下面是我想出了您的方案。

Here is what i came up with for your scenario.

基本上，你可以写这需要 ngModel （ngModelController）指令。该ngModelController有它称之为以管道方式来解析视图值解析器的数组。如果验证失败，这些解析器不更新模型。如果在此解析器数组的开始注入一个自定义分析器，可以得到每个视图变化值，做你想做的事情什么。

Basically you can write a directive which requires ngModel (ngModelController). The ngModelController has a array of parsers which it call to parse the view value in a pipeline manner. If validation fail these parsers do not update the model. If you inject a custom parser at the start of this parsers array, you can get the each view change value and do anything you want with it.

请参阅我的plunkr这里<一个href=\"http://plnkr.co/edit/ruB42xHWj7dBxe885OGy?p=$p$pview\">http://plnkr.co/edit/ruB42xHWj7dBxe885OGy?p=$p$pview （见控制台）

See my plunkr here http://plnkr.co/edit/ruB42xHWj7dBxe885OGy?p=preview (See console)

基本code将

ngModelCtrl.$parsers.splice(0,0,(function (viewValue) {
              console.log("The view value is:"+viewValue)
                return viewValue;           
            }));

另请参见 ngModelController documenation

这篇关于获取＆QUOT; RAW＆QUOT;从无效的输入字段值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！