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

【问题标题】：Disable Only Button If Either Rows Empty Angular如果任一行为空，则仅禁用按钮
【发布时间】：2017-10-23 23:30:34
【问题描述】：

我在 2 个 angular 表中有 2 行，只有一个提交按钮，我需要帮助，因为如果 2 个表中的 2 行为空，我只能禁用提交按钮。如果只有一行为空但另一行不为空，我如何才能禁用按钮？ <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>

【问题讨论】：

stackoverflow.com/a/43765804/5774939你能试试这个吗？
@SDhaliwal。它不起作用
用什么变量来填充行？
@BleachedAnus。我在上面添加了一个新文件
你对这些表使用 ngFor 吗？

标签： angular angular-services angular-reactive-forms angular4-forms

【解决方案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>

【讨论】：

【解决方案2】：

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

【讨论】：

我认为这不是一个好的解决方案。如果数组如下所示：['ds','ds','','ds']
您只需检查数组是否为空而不是数组的元素是否为空。
这不起作用。您必须在启用按钮之前填写 2 行
您能否详细说明您的答案并解释其工作原理？

【解决方案3】：

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

【讨论】：