从无效输入字段中获取"原始"值

Question

我在一个带有一些验证的表单中有一个输入字段.它就像一个魅力.

它基本上看起来像这样:

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

一个工作的plunkr在这里:http://plnkr.co/edit/H0h59kG75T5MGE9cAhSo?p=preview

但现在我也想对每一次输入变化作出反应 - 无论是否有效.因此,例如,如果输入字段包含"123",则它无效,并且该值不会传输到我的模型 - 没关系.但我仍然希望获得对Web服务进行一些中间请求的价值.

有任何想法吗？

Answer 1

首先调用控制器中的表单元素,然后使用$viewValue属性:

查看:

<form name="form">
<input
  ...
  ng-model="zipcode"
  ng-change="getRawValue(form)"
  name="zipcode"
  required
>
</form>

控制器:

$scope.getRawValue = function(form) {
  var rawValue = form.zipcode.$viewValue;
}

Answer 2

Angular 1.3为此引入了一个真正的答案:allowInvalid在ngModelOptions中.

例:

<input 
    type="text"
    name="userName"
    ng-model="user.name"
    ng-model-options="{allowInvalid: true}"
>

Answer 3

以下是我为您的场景提出的建议.

基本上你可以编写一个需要ngModel(ngModelController)的指令.ngModelController有一个解析器数组,它调用它以管道方式解析视图值.如果验证失败,则这些解析器不会更新模型.如果在此解析器数组的开头注入自定义解析器,则可以获取每个视图更改值并使用它执行任何操作.

在这里查看我的plunkr http://plnkr.co/edit/ruB42xHWj7dBxe885OGy?p=preview (查看控制台)

基本代码是

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

另请参阅ngModelController文档