title: Angular 6: don't trigger validators setValue
body: <p>I'm building a CRUD app using <code>Angular 6.</code> </p>
  
  <p>My forms are used for adding and updating items. When the user updates an item, the form is pre-populated from the server. When the server updates the form it triggers the validation. </p>
  
  <p>How can I update the form values without triggering the validation?</p>
  
  <p>Here is the relevant code:</p>
  
  <pre><code>ngOnInit(){
      this.form = this.fb.group({
          name: ['', [Validators.required], MyAsyncValidator],
          comments: [''],
      });
  
      this.http.get('/api')
          .subscribe((data: any) =&gt; {
              this.form.setValue({ name: data.name, comments: data.comments });
          });
      //How to populate form without triggering validation
  }
  </code></pre>
  
  <p>The template:</p>
  
  <pre><code>&lt;form [formGroup]="form"&gt;
  &lt;div class="form-group row"&gt;
      &lt;label class="col-sm-2 col-form-label"&gt;Name&lt;/label&gt;
      &lt;div class="col-sm-10"&gt;
          &lt;input formControlName="name"
              class="form-control"
              [ngClass]="{'is-invalid': isInvalid(form.controls.name)}"
              type="text"&gt;
          &lt;small *ngIf="form.get('name').status=='PENDING'" class="form-text text-muted"&gt;
              &lt;i class="fa fa-spinner fa-spin"&gt;&lt;/i&gt; Checking Name...
          &lt;/small&gt;
          &lt;small class="invalid-feedback"&gt;
              &lt;div *ngIf="form.controls['name'].hasError('required')"&gt;Name Required&lt;/div&gt;
              &lt;div *ngIf="form.controls['name'].hasError('exists')"&gt;Name Exists&lt;/div&gt;
          &lt;/small&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>