title: Angular 2: How to bind Input to model property with getter and setter methods?
body: <p>I'm making an Angular 2 web app. I have a model that is comprised of a few key properties, and then several other properties that are computed based off those key values.</p>
  
  <p>All of my properties have getter methods. To keep my computed properties in sync with my key properties, the key properties are changed via setter methods which re-evaluate all of the computed properties. Here's a simplified example:</p>
  
  <pre><code>export class Model{
      private _keyValue: number;
      private _computedValue: number;
  
      getKeyValue(): number{
          return this._keyValue;
      }
  
      setKeyValue(value: number){
          this._keyValue = value;
          this.evaluateComputedValues(); // This might be time-consuming
      }
  
      getComputedValue(): number{
          return this._computedValue;
      }
  }
  </code></pre>
  
  <p>This keeps my model consistent: every time one of the key properties is changed, all of the computed properties are re-computed.</p>
  
  <p>Now I need to figure out how to bind my properties to my component views. It seems like I can present the computed property getters using interpolation:</p>
  
  <pre><code>&lt;div&gt;{{model.getComputedValue()}}&lt;/div&gt;
  </code></pre>
  
  <p>However, I'm not sure what the best way to bind my key properties to input fields would be. All of the examples of using two-way binding seem to use ngModel like this:</p>
  
  <pre><code>&lt;input [(ngModel)]='model.property'&gt;
  </code></pre>
  
  <p>However, that seems geared towards binding to simple properties. I ideally need two-way binding using my separate getter and setter methods (getKeyValue and setKeyValue).</p>
  
  <p>Is there any built-in way to accomplish this in Angular 2?</p>