Typescript 如何使用NgClass条件更改样式？

我有一个带有一些字段的表单。我将字段分为三种形式组

如何在HTML中获得NgClass条件类

我试过这样的方法：

Ts模型文件：

export class Rule {
id: number;
name: string;

TS文件：

export class RegrasModalComponent implements OnInit, OnDestroy {

// Propriedades Input do componente
  @Input() title: string;
 @Input() rule: Rule;

ngOnInit() {
this.ruleForm = this.fb.group({
  name: ['', Validators.required],
  dataInicio: ['', Validators.required],
  dataFim: ['', Validators.required],
  cell: ['', Validators.required],
});

HTML:

我收到了这个消息： 无法读取未定义的属性“valid” at Object.eval[作为updateDirectives]

---

pease，有人能帮我吗？

对象的属性

名称
规则
不存在。也许您希望访问对象
ruleForm
，如
ngOnInit
函数中定义的那样

[ngClass]="{ 'has-error': ruleForm.name.valid }"

无法读取未定义的属性
的含义始终相同。您正试图从没有有效（未定义）变量的属性（
valid
）中读取值。您应该用一个值填充name属性。是的，但我想知道字段“name”上是否有值。我将对此进行测试。错误类型错误：无法读取Object.eval[as updateDirectives]（RegrasModalComponent.html:10）的undefined at Object.eval的属性“valid”（有效）在
规则
对象中没有属性
value
@比斯内托坦，尼古拉斯！答案很好。但实际上没有帮助。但是maaaany谢谢！
[ngClass]="{ 'has-error': ruleForm.name.valid }"