required和ng-required之间有什么区别?

What is the difference between required and ng-required (form validation)?

required和ng-required(表单验证)之间有什么区别?

3 个解决方案

#1

409

AngularJS form elements look for the required attribute to perform validation functions. ng-required allows you to set the required attribute depending on a boolean test (for instance, only require field B - say, a student number - if the field A has a certain value - if you selected "student" as a choice)

AngularJS表单元素寻找执行验证功能所需的属性。ng-required允许您根据布尔测试设置必需的属性(例如，只需要字段B——比如一个学生号——如果字段a具有一定的值——如果您选择了“student”)

As an example, <input required> and <input ng-required="true"> are essentially the same thing

例如，和本质上是相同的

If you are wondering why this is this way, (and not just make <input required="true"> or <input required="false">), it is due to the limitations of HTML - the required attribute has no associated value - its mere presence means (as per HTML standards) that the element is required - so angular needs a way to set/unset required value (required="false" would be invalid HTML)

如果你想知道为什么这是这样,(而不仅仅是使 <输入所需= " true> 或 <所需输入=“false”> ),这是由于HTML的局限性——所需的属性没有关联的值——它的存在意味着(按照HTML标准)的元素是必需的,所以角需要一种方法来设置/设置要求值(要求=“false”将是无效的HTML)

#2

I would like to make a addon for tiago's answer:

我想为提阿古的回答加上一句:

Suppose you're hiding element using ng-show and adding a required attribute on the same:

假设您使用ng-show隐藏元素，并在其上添加一个必需的属性:

<div ng-show="false">
    <input required name="something" ng-model="name"/>
</div>

will throw an error something like :

会抛出一个错误，比如:

An invalid form control with name='' is not focusable

名称= "的无效窗体控件不可调焦

This is because you just cannot impose required validation on hidden elements. Using ng-required makes it easier to conditionally apply required validation which is just awesome!!

这是因为您不能将必需的验证强加到隐藏的元素上。使用ng-required使得有条件地应用所需的验证变得更容易，这是非常棒的!

#3

The HTML attribute required="required" is a statement telling the browser that this field is required in order for the form to be valid. (required="required" is the XHTML form, just using required is equivalent)

required="required"的HTML属性是一条语句，它告诉浏览器，为了使表单有效，需要这个字段。(required=“required”是XHTML表单，仅使用required是等效的)

The Angular attribute ng-required="yourCondition" means 'isRequired(yourCondition)' and sets the HTML attribute dynamically for you depending on your condition.

角属性ng-required="yourCondition"表示" isRequired(yourCondition) "，并根据您的条件动态设置HTML属性。

Also note that the HTML version is confusing, it is not possible to write something conditional like required="true" or required="false", only the presence of the attribute matters (present means true) ! This is where Angular helps you out with ng-required.

还要注意，HTML版本令人困惑，不可能写出条件句如required="true"或required="false"，只有属性的存在才重要(present意味着true) !这就是角度帮助你解决需要ng的问题。

#1

409