css - 为什么 form.validate 和 .ng-invalid-emal.ng-dirty 之间有空格

Question

在样式表的 AngularJS 应用程序中，我不明白“form.validate”和“.ng-invalid-email.ng-dirty”之间的空格在哪里:

<style>
    form.validate .ng-invalid-required.ng-dirty {background-color: lightpink;}
    form.validate .ng-invalid-email.ng-dirty {
        background-color: lightgoldenrodyellow;
    }
    div.error { color: red; font-weight: bold;}
</style>

任何提示或帮助将不胜感激。

Answer 1

那些是 css 选择器。

form.validate 是任何具有 .validate 类的表单的选择器。 .ng-invalid-required.ng-dirty 匹配任何同时具有 .ng-invalid-required 和 .ng-dirty 类的元素.

相当于在css文件中写了如下内容:

.class1.class2 {
    color: #fff;
}

Angular 将对处于特定状态(无效、有效等)的元素进行分类，并允许您定义这些状态的样式定义方式。也许你改变颜色，加粗，下划线，添加星号等等。它们只是在使用 ng 时简化你的生活的钩子(Hook)。