Question

我正在尝试以通用方式输出无效的字段名称。下面通过循环遍历表单中的所有字段并仅附加到具有键名称的字符串来完成此操作。单击提交按钮时会运行它：

for (var key in form) {
    if (key.indexOf("$") !== 0) {
        if (form[key].$invalid) {
            str += '- ' + key + '<br />';
        }
    }
}

我唯一的问题是键出现的顺序与字段在页面上显示的顺序不匹配。我假设它与字段本身的创建方式有关，因为动态生成的字段似乎出现在普通字段之前。我真的很想维持秩序，但想不出一个好方法。

希望有人会有建议吗？

Answer 1

您可以通过浏览DOM来简单地遍历控件：

// Assuming $element is your <form>
var invalidFields = [];
$element.find('.ng-invalid').each(function() {
    invalidFields.push(this.name);
});

这种方法只是使用NgModelController将在所有无效控件上设置ng-invalid CSS类的事实。使用Angular并不意味着禁止使用DOM。

Answer 2

有一个包含字段名称的数组，并迭代它以检查

for ex: 
var fieldsInOrder = ["field1", "field2", "field3"];//can creaate in dynamically by iterating Dom also or have a static one.
for (var i=0; i<fieldsInOrder.length; i++) {
    var currentField = fieldsInOrder[i];
    if (form[currentField ].$invalid) {
        str += '- ' + key + '<br />';
    }
}

角度验证 - 按页面顺序输出无效字段

2 个答案: