ng-valid[required]、.ng-valid.required 有什么区别？

【问题标题】：What is the difference between ng-valid[required], .ng-valid.required?ng-valid[required]、.ng-valid.required 有什么区别？
【发布时间】：2017-04-23 09:01:08
【问题描述】：

我正在通过 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 选择器同时使用，我们不能只用其中一个来替换吗？

【问题讨论】：

我认为 .ng-valid[required] 它的外观很好看，需要的指令是否已预设，而 .ng-valid.required 在特定的 html 标记中查找 .required 类。

标签： css angular

【解决方案1】：

.ng-valid[required] 规则适用于

<input class="ng-valid" required>

.ng-valid.required 规则适用于

<input class="ng-valid required">

这两条规则都适用于

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

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

【讨论】：

所以对于需要不是内置的？它是由用户创建的？
是的，用户必须检查！浏览器可以检测到所需的（第一个示例）。