如何根据表单的状态有条件地格式化测试？

Question

我试图让我的表单在表单无效时显示红色文本，在表单有效时根据表单状态和验证标准显示绿色文本。通过angular8如何实现？

(HTML)

   <p class="status">
   Form Status: {{ Form.status }}
   </p>

(TS)

      Form = this.fb.group({
        Id: [0],
        name: ['', Validators.required],
        app: ['', Validators.required],
        domain: [''],
        environment: ['']
         })

Answer 1

创建无效-class CSS 并将您的 html 调整为：

<p class="status">
   Form Status: 
   <span [class.invalid-class]="Form.invalid">
      {{ Form.status }}
   </span>
</p>

如何根据表单的状态有条件地格式化测试？

How to conditionally format test based on status of a form?

html

css

conditional-formatting

typescript

angular