验证不会触发时，数据绑定多个输入的最低/最高属性 [英] Validation not triggered when data binding a number input's min / max attributes

问题描述

我有最大和最小属性依赖于逻辑别处在我AngularJS应用程式值众多号码输入字段，但使用这些属性中的数据绑定当它们被角不再验证，然而，在HTML 5验证仍然出现来接他们。

I have numerous number input fields that have min and max attribute values that depend on logic elsewhere in my AngularJS app, but when using data bindings within these attributes they are no longer validated by Angular, however, the HTML 5 validation still appears to pick them up.

var myApp = angular.module('myApp', []);
function FirstCtrl($scope) {
    $scope.min = 10;
    $scope.max = 20;
}

<div ng-app="myApp">
    <div ng-controller="FirstCtrl">
        <form name="myForm">
            <input type="number" name="one" required="required"
                   min="10" max="20" ng-model="one" />
            <input type="number" name="two" required="required"
                   min="{{ min }}" max="{{ max }}" ng-model="two" />
            <button ng-disabled="!myForm.$valid">Submit</button>
        </form>
    </div>
</div>

直播版本： http://jsfiddle.net/kriswillis/bPUVH/2/

如你所见，验证仍是在HTML / CSS（引导）为这两个领域变红处理粉无效的时候，然而，提交按钮（由角处理）是不是当第二场是无效的禁用。另外，还有一些在 myForm.two。$没有错误的最小值和最大值的属性，因为在 myForm.one。$误差。

As you can see, the validation is still handled fine in the HTML/CSS (Bootstrap) as both fields turn red when invalid, however, the submit button (handled by Angular) is not disabled when the second field is invalid. Also, there are no min and max properties in myForm.two.$error as there are in myForm.one.$error.

任何人都可以看到我要去哪里错了？

Can anyone see where I'm going wrong?

推荐答案

显然，我们不能使用{{}} S（即插值）为分和最大字段。我看了看<一个href=\"https://github.com/angular/angular.js/blob/f0c6ebc07653f6267acec898ccef5677884e3081/src/ng/directive/input.js#L528\">source code ，我发现以下内容：

Apparently we can't use {{}}s (i.e., interpolation) for the min and max fields. I looked at the source code and I found the following:

if (attr.min) {
  var min = parseFloat(attr.min);

$插值不叫，只是 parseFloat ，所以你需要指定一个字符串，它看起来像一个数分和最大。

$interpolate is not called, just parseFloat, so you'll need to specify a string that looks like a number for min and max.

这篇关于验证不会触发时，数据绑定多个输入的最低/最高属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！