title: Updating input value after model bind
body: <p>I have a text input two-way bound to a <code>Date</code> type model property:</p>
  
  <pre><code>&lt;input type="text" [(ngModel)]="model.DateStart" ngControl="dateStart" id="dateStart" #dateStart /&gt;
  </code></pre>
  
  <p>The <code>model.DateStart</code> (DateTime type) value is this:</p>
  
  <pre><code>2016-05-24T13:49:40.4367997+03:00
  </code></pre>
  
  <p>Which I want to display like this:</p>
  
  <pre><code>24.05.2016
  </code></pre>
  
  <p>I populate model data in constructor and after binding the model I update the input value using jQuery:</p>
  
  <pre><code>Observable.forkJoin(
                  ..
          ).subscribe(
              results =&gt; {
                  this.model = results[0];
  
                  let element: any = $(input);
                  element.bootstrapMaterialDatePicker();
                  element.val("24.05.2016");
                  console.log(element.val()) // displays "24.05.2016"
              },
  </code></pre>
  
  <p>The thing is, when the page loads the textbox displays <code>2016-05-24T13:49:40.4367997+03:00</code>.</p>
  
  <p>It seems that my custom format is overwritten afterwards. Is there a way to accomplish this without setting the type of the <code>model.DateStart</code> to string and format it before binding?</p>
  
  <p>I cant use input type=date because of the datetime picker component.</p>