title: Angular2 /Ionic2: databinding
body: <p>I have a simple component as follow: </p>
  
  <pre><code>import {Page} from 'ionic-framework/ionic';
  import {Component} from 'angular2/core';
  import {Data} from './data';
  
  @Page({
              selector: "main-page",
              templateUrl: 'build/pages/main/main.html'
  })
  
  export class MainPage 
  {
      submitted: number;
      model: Array&lt;number&gt;;
  
      constructor(){
         this.submitted = false;
      }
       model = new Data('50', ['10', '20']);
        onSubmit()
      {
          this.model.households.push('3');
      }
  
      backToForm()
      {
          this.submitted = false;
      }
  }
  </code></pre>
  
  <p>with the following template: 
      
        
          
        
        MainPage
      </p>
  
  <pre><code>&lt;ion-content padding class="getting-started" &gt;
  
        &lt;h1&gt;Random selection of houses generator&lt;/h1&gt;
        &lt;div [hidden]='submitted'&gt;
          &lt;form (ngSubmit)="onSubmit()" #dataForm="ngForm"&gt;
              &lt;ion-list&gt;
                &lt;ion-item&gt;
                  &lt;ion-label floating&gt;Number of houses in the village&lt;/ion-label&gt;
                  &lt;ion-input 
                        type="number"
                        required
                        [(ngModel)]="model.totalhousehold"
                        ngControl = "totalhousehold"
                      &gt;&lt;/ion-input&gt;
                &lt;/ion-item&gt;
              &lt;/ion-list&gt;
              &lt;button 
                      secondary
                      [disabled]="!dataForm.form.valid"
                      &gt;Generate random selection!&lt;/button&gt;
          &lt;/form&gt;
        &lt;/div&gt;
  
        &lt;div [hidden]='!submitted'&gt;
            villages: {{ model.totalhousehold }}
  
            Array: {{ model.households }}
  
  
            &lt;button (click)=backToForm()&gt;
                back to form
            &lt;/button&gt;
        &lt;/div&gt;
  
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>this is my data.ts:</p>
  
  <pre><code>export class Data {
  
      constructor(
          public  totalhousehold:      number,
          public households: Array&lt;number&gt;,
       ) { }
  }
  </code></pre>
  
  <p>On each submit I push a value in my "households" array and hide the form. Back to Form display the form. If I modify the form value (totalhouseholds), my Array (households) is displayed correctly. But it I submit again without modifying the value; the displayed array is not updated.
  Any idea advice be welcome</p>