ANGULAR - 如果表单值未更改，则禁用提交按钮

Question

我有选定日期的表格。如果日期形式没有任何变化，如何禁用提交按钮？

我的 html 代码

<div class="col-xs-6">
   <label><i class="far fa-calendar-alt"></i> Start <span class="text-danger">*</span></label>
     <input id="startTrip1" name="NgbDate" data-provide="datepicker" ngbDatepicker #d="ngbDatepicker" [markDisabled]="markDisabled" [minDate]="minDates" type="text" class="form-control form-flat" [(ngModel)]="ad.start_date" (dateSelect)="onDateSelect($event, ad)" (blur)="validateInput()" (click)="d.toggle()" [ngModelOptions]="{standalone: true}" [disabled]="form.controls.tripduration.hasError('required')" >
      <div class="text-danger" *ngIf="(ad.start_date == '' || ad.start_date == undefined) && ngForm.submitted">
         * This field is required
       </div>
      <div class="text-danger" *ngIf="form.controls.tripduration.hasError('required')">
      * Fill the durations first
      </div>
 </div>
//submit button
<button class="col-xs-12 text-center text-strong pointer custom-trip-btn" (click)="publishTrip()">
<button class="custom-trip-btn">SUBMIT</button>

原文由 Soni Silalahi 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果您使用以下代码，则只有在用户更改表单中的值时才会启用该按钮

[disabled]="!(accountForm.valid && accountForm.dirty)"

原文由 lahiru dilshan 发布，翻译遵循 CC BY-SA 4.0 许可协议