“ng-valid[required]”和“.ng-valid.required”有什么区别？

Question

我正在进行练习，参考了https://angular.io/docs/ts/latest/guide/forms.html，然后我看到了这段代码：

.ng-valid[required], .ng-valid.required  {
  border-left: 5px solid #42A948; /* green */
}

.ng-invalid:not(form)  {
  border-left: 5px solid #a94442; /* red */
}

为什么同时使用.ng-valid[required]和.ng-valid.required选择器，我们不能只用其中一个来替代它们吗？

- Sarah cartenz

---

我认为.ng-valid[required]是在查找必填指令是否存在，而.ng-valid.required则是在特定的HTML标签中查找.required类。 - Vinay Pandya

Answer 1

.ng-valid[required]规则适用于必填字段。

<input class="ng-valid" required>

.ng-valid.required规则适用于

<input class="ng-valid required">

这两个规则对于

<input class="ng-valid required" required>

现在你可以选择要使用的解决方案，并删除CSS中不必要的规则。

- Sebastian Brosch

---

那么对于<input class="ng-valid required">，它不是内置的必需的吗？它是由用户创建的吗？ - Sarah cartenz

是的，用户必须检查！所需的内容（第一个示例）可以由浏览器检测到。 - Sebastian Brosch