1

我是 Angular 的新手，我正在研究 Reactive Forms，我还在项目中包含了 Bootstrap，如果输入文本有效并且具有类“ng-valid”，我需要添加类“has-success”到父 div，所以它会变成绿色并采用 Bootstrap 的样式。

4

3 回答 3

2

尝试这个

<input [ngClass]="{'has-success': true}" />

您可以将组件的任何变量替换为 true

于 2017-06-27T14:45:56.533 回答
0

如果你正在使用 ReactiveFormsModule，你可以做这样的事情

在您的组件中：

constructor(private fb: FormBuilder) {
    this.form = this.fb.group({
        myControl: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(4)]],
    });
}

并在您的模板中：

<form [formGroup]="form" novalidate>
    <div [ngClass]="{'has-success': form.controls.myControl.valid}">
        <input formControlName="myControl" type="text"/>
    </div>
</form>
于 2017-06-27T15:59:05.033 回答
0

当你只需要设置一个类时，而不是使用ngClass，看起来更容易阅读，像这样设置类

<div [class.has-success]="true">

您可以在其中将 替换为true任何表达式。如果您需要针对您的子元素的帮助，您可以在 fiddle/plnkr 中发布您的 html - 如果您想要一个简单的复制/粘贴答案:)

于 2017-08-17T19:42:19.117 回答