title: How do I disable a button in a form?
body: <p>I want the signup button to be disabled whenever the form is complete.</p>
  
  <pre><code>&lt;form [formGroup]="service.formModelInstrumexts" autocomplete="off" (submit)="onSubmit()"
    style="background-color: #0067b8 !important; margin-top: 25px; margin-left: 600px; margin-right: 600px;"&gt;
    &lt;div style="padding: 15px"&gt;
  
  &lt;div&gt;
    &lt;h3 style="color: azure"&gt;
      اضافه کردن ساز
    &lt;/h3&gt;
  &lt;/div&gt;
      &lt;select   id="ddl" style="width:200px; margin-right: 1%; margin-bottom: 10px; border-radius: 0px;" dir="rtl"
        class="custom-select custom-select-sm"&gt;
        &lt;option&gt; لطفا نوع ساز را انتخاب نمایید&lt;/option&gt;
        &lt;option *ngFor="let item of type; let i = index" style="color: black;" (click)="test(item.id)" &gt;{{item.name}}
        &lt;/option&gt;
      &lt;/select&gt;
  
      &lt;div class="form-group"&gt;
        &lt;label&gt;نام&lt;/label&gt;
        &lt;input style="width: 40%; margin-left: 60%; border-radius: 0px;" class="form-control" formControlName="Name"&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
        &lt;label&gt;توضیحات&lt;/label&gt;
        &lt;textarea [(ngModel)]="name"  style="direction: rtl; color: rgb(3, 0, 0); border-radius: 0px;" class="form-control" formControlName="Comment"
          aria-label="With textarea"&gt;&lt;/textarea&gt;
      &lt;/div&gt;
  
  
      &lt;div  *ngIf="name != null" &gt;
        &lt;app-upload style=" width: 100px; "
          (onUploadFinished)="uploadFinished($event)"&gt;&lt;/app-upload&gt;
        &lt;img src="http://localhost:54277/{{this.response.dbPath}}" *ngIf="this.response.dbPath != null" width="200px"
          height="200px"&gt;
      &lt;/div&gt;
  
      &lt;div class="form-row"&gt;
        &lt;div class="form-group col-md-8 offset-md-2"&gt;
          &lt;button style="width: 100px; color: #0067b8; background-color: #fff; border-color: transparent; border-radius: 0px;margin-left: 8px;" type="submit" class="btn btn-lg btn-block"
            [disabled]="!service.formModelInstrumexts.valid" &gt;ثبت
          &lt;/button&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>