Scenario
我试图禁用[禁用]按钮并通过两个条件选择类[ngClass]:
1st:需要输入文字 .
第二:异步标志是requiredTrue . 我对需求的依赖是对远程服务器的挑战,这是启用此按钮的触发器 .
好吧,我正在使用这样的formGroup验证:
constructor(private fb: FormBuilder) {
this.form = this.fb.group({
'inputSMS': [null, Validators.required],
'button': [false, Validators.requiredTrue]
})
}
第一个条件= inputSMS;第二个=按钮 .
在我的HTML中,我将此代码用于第一个条件:
<div class="col-xs-offset-1 col-xs-10">
<div [formGroup]="form">
<label class="col-xs-4 F sms-codigo-sms">SMS Code</label>
<div class="col-xs-6">
<input class="form-control sms-rect7" [(ngModel)]="inputSMS" formControlName="inputSMS" name="inputSMS" maxlength="20" type="numbers">
</div>
</div>
</div>
这是第二个:
<div class="form-group row text-center">
<div class="col-md-12">
<div class="btn-group">
<button [ngClass]="!form.valid ? 'sms-btn-disabled' : 'sms-btn'"
type="button" style="float: left;" [disabled]="!form.valid"
formControlName="button" (click)="check()">Validate</button>
</div>
</div>
Problem
我正确地收到了带有主题的异步标志 . 我检查了一下 . 第一个条件是真的 . 但我不知道为什么在条件成立时没有启用按钮 . 好像没有检测到事件的变化 . 我只使用了输入的ngModel,但我不确定我是否可以在这里使用它 . 你知道我怎么解决它?
谢谢 .
2 回答
Problem solved
最后,我没有使用FormGroup解决了这个问题 . 由于我有一个可观察的通知,如果挑战到达我使用了两个不同的控件 . 其中一个是已知控件“form.valid”,另一个是类的属性,当可观察到的响应到达时它会更新 . 然后我将这两个属性设置为条件 . 这里代码:
在打字稿中
在HTML中
不需要这个