Question

我在2个表格中有2行，只有一个提交按钮，我需要帮助，因为如果2个表中的2行为空，我只能禁用提交按钮。如果只有1行是空的但另一行不为空，我怎么才能禁用按钮？ <button type="submit" class="btn btn-primary float-right" [disabled]="!myForm.valid || myForm.controls.rows.length == 0">Save</button>

TS

this.myForm = this.fb.group({
      rows: this.fb.array([]),
      rows2: this.fb.array([])
    });

HTML

<form class="form-horizontal" [formGroup]="myForm" (ngSubmit)="onCreate()" >
    <div class="card-block" formArrayName="rows">
    <table>
    <tr *ngFor="let row of myForm.controls.rows.controls; let i = index" [formGroupName]="i">
    ....
    </table>
    </div>

    <div class="card-block" formArrayName="rows2">
    <table>
    <tr *ngFor="let row2 of myForm.controls.rows2.controls; let i2 = index" [formGroupName]="i2">
    ...
    </tr>
    </table>
    </div>
    <button type="submit" class="btn btn-primary float-right" [disabled]="!myForm.valid || myForm.controls.rows.length == 0">Save</button>
</form>

Answer 1

我不确定它是最好的解决方案，但您可以在获取数据后调用控制器和函数中创建简单标志：

yourflag = false;
fun() {
for (let r of rows) {
if(r == '' || r == null) yourflag = true;
}
for (let r of row2s) {
if(r == '' || r == null) yourflag = true;
}
}

并在按钮中

<button type="submit" class="btn btn-primary float-right" [disabled]="yourFlag || !myForm.valid || myForm.controls.rows.length == 0">Save</button>

Answer 2

[disable]="myForm.invalid || !myForm.controls.rows.length || !myForm.controls.rows2.length

Answer 3

这对我有用。 <button type="submit" class="btn btn-primary float-right" [disabled]="myForm.invalid || !myForm.controls.rows.length && !myForm.controls.rows2.length">Save</button>

如果任一行为空角，则仅禁用按钮

3 个答案: