css - 在 Angular 7 中向标签添加所需的星号

Question

我正在使用 Angular 7。当标签具有 required 属性时，我想要一个带有 red 必需星号的标签。我写了 app.component.css 如下 Stackblitz。但它没有用。 不工作的原因是什么？ (或者做这项工作的另一种方式？)

应用程序组件.css

label.required::after {
    content: " *";
    color: red;
}

app.component.html

<label required>Test Content</label>

STACKBLITZ

我想将结果显示为

测试内容*

Answer 1

label.required 是具有 class required 标签的选择器。

<label class="required">

对于具有属性 required 的标签，它将是label[required]。

那是纯 CSS，顺便说一句，与 Angular 和 TypeScript 完全无关。