title: Angular2 Reactive forms, FormControl default value in pristine status
body: <p>I have created a form which allows the user to add additional text-inputs by clicking a button. The <code>FormControl</code>s behind these inputs are stored in a <code>FormArray</code> inside of a <code>FormGroup</code>.</p>
  
  <p>I want to provide a default value for these inputs, that is going to be submitted if they are pristine. If the user changes the value of the input, which changes it to dirty, I do not want the default value to be submitted or displayed.</p>
  
  <p>I currently am displaying the inputs like this, as the placeholder attribute does exactly what I want, displaying the default name, only if the input has not been changed.</p>
  
  <pre><code>&lt;div
      formArrayName="names" 
      *ngFor="let server of names.controls; let i = index; trackBy:trackByFn"&gt;
          &lt;span&gt;{{ i + 1 }}&lt;/span&gt;
          &lt;input 
          type="text" 
          formControlName="{{i}}"
          placeholder="{{defaultName}}"&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>To validate the names I have created the following validation function:</p>
  
  <pre><code>export function validateServerName(form: FormGroup): ValidationErrors | null {
      const names: string[] = form.value[CREATE_FORM_KEY_NAMES];
  
      for (const name of names) {
          if (name.trim() === '') {
              return {
                  invalidName: true
              };
          }
      }
  
      return null;
  }
  </code></pre>
  
  <p>Here I am having trouble figuring out if the element is dirty or pristine, as <code>form.value[key]</code> only returns a string array, not an array of the FormControls.</p>
  
  <p>I am looking for either an easier way to do what I am trying to achieve, or a way to validate the form properly.</p>