title: Angular 2 can't set default value for ControlValueAccessor component
body: <p>Scaled down plunkr: <a href="https://plnkr.co/edit/gGCiYjcq70xaewn3n22F?p=preview" rel="noreferrer">https://plnkr.co/edit/gGCiYjcq70xaewn3n22F?p=preview</a></p>
  
  <pre><code>@Input() model: any;
  
  propagateChange = (_: any) =&gt; {};
  
  registerOnChange(fn) {
    this.propagateChange = fn;
  }
  
  registerOnTouched() {}
  
  writeValue(value: any) {
  
    if (value !== undefined) {
      this.model = value;
    }
  }
  
  ngOnInit() {
  
    // Sets the model properly, but it doesn't show up in the view or outside of the component
    if (!this.model &amp;&amp; this.isRequired) {
      this.model = options[0];
    }
  
    this.propagateChange(this.model);
  }
  </code></pre>
  
  <p>Usage:</p>
  
  <pre><code>&lt;form #myForm="ngForm"&gt;
    &lt;custom-select #fuel="ngModel" [(ngModel)]="model.fuel" [options]="fuels" [isRequired]="true" name="fuel"&gt;&lt;/custom-select&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I've implemented <code>ControlValueAccessor</code> for a custom select, but I can't get it to set a default value when the component is first initialised in the <code>ngOnInit</code> method. The <code>model</code> is set inside of the component correctly, but it's not reflected in the view or outside of the component. But if I then change the value by selecting some other option it works.. Does anyone know why this is?</p>