javascript - 使用 ngIf 错误时如何禁用 Angular 6 中的按钮保存

Question

单击“保存”时遇到问题，错误消息“无法读取 null 的属性“必需” 在 Object.eval [作为 updateDirectives]"

这是我的代码 html

 <form name="dataForm" [formGroup]="dataForm" (ngSubmit)="onSubmit()">
        <div class="mb-24" fxLayout="row" fxLayoutAlign="start start" [ngClass]="{'has-error': ((dataForm.get('usernames').touched ||
        dataForm.get('usernames').dirty) &&
        dataForm.get('usernames').errors)}">
            <mat-form-field fxFlex>
                <input matInput placeholder=" Username" formControlName="usernames">
                <mat-error *ngIf="((dataForm.get('usernames').touched ||
                    dataForm.get('usernames').dirty) &&
                    dataForm.get('usernames').errors).required">
                    Username empty
                </mat-error>
            </mat-form-field>
        </div>

这个按钮

 <button mat-raised-button class="save-button mat-accent" type="submit" (click)="showToaster()"
                [mat-dialog-close] [disabled]="dataForm.errors.required? true: null">Save</button>&nbsp;

Answer 1

您只需执行[disabled]="!dataForm.valid"即可。