required
和 ng-required
(表单验证) 有什么区别?
AngularJS表单元素查找required
属性来执行验证功能。ng-required
允许您根据布尔测试设置required
属性(例如,仅在字段A具有特定值时要求字段B - 比如说,学生编号必填 - 如果您选择“学生”作为选项)
例如,<input required>
和<input ng-required="true">
本质上是相同的。
如果您想知道为什么是这样(而不只是使用<input required="true">
或<input required="false">
),那是由于HTML的限制 - required
属性没有关联的值 - 仅存在意味着(按照HTML标准)该元素是必填的 - 因此Angular需要一种设置/取消设置必填值的方式(required="false"
将是无效的HTML)
我想为 tiago的回答 制作一个插件:
假设你正在使用 ng-show
隐藏元素,并同时添加 required
属性:
<div ng-show="false">
<input required name="something" ng-model="name"/>
</div>
会抛出一个类似以下的错误:
一个名称为''的无效表单控件是无法聚焦的
这是因为你不能在hidden
元素上强制执行required
验证。使用ng-required
可以更轻松地有条件地应用必填项验证,非常棒!
ng-if
代替 ng-show
/ng-hide
来避免潜在的问题。 - jkjustjoshingHTML属性 required="required"
是一种声明,告诉浏览器该字段是必填的,以使表单有效。(使用 required
等同于 XHTML 表单中的 required="required"
)
Angular 属性 ng-required="yourCondition"
意味着 'isRequired(yourCondition)' 并根据您的条件为您动态地设置 HTML 属性。
此外,请注意HTML 版本容易令人感到困惑,不可能编写条件语句如 required="true"
或 required="false"
,只有出现该属性才会起作用(出现即为真)!这就是 Angular 在ng-required
方面帮助您的地方。
ng-required
指向作用域/控制器变量时,Angular 会监视它的变化并相应地设置所需的属性。而对于简单 HTML 的required
属性,您没有那种灵活性。不是吗?还有,在同一主题上,ng-attr-required
又如何呢?它和ng-required
完全相同吗? - AsGoodAsItGets