import { Component } from '@angular/core';
import { DecimalPipe } from '@angular/common';
import { ToNumberPipe } from './to-number.pipe';

@Component({
  selector: 'my-app',
  template: `<input type='text' [(ngModel)]="model">
             <div style="margin-top:1em;"> model數值: {{ _model || 0}}</div>
             <div style="margin-top:1em;"> model格式化數值: {{ model || 0}}</div>`,
  providers: [
    ToNumberPipe,
    DecimalPipe
  ]
})
export class AppComponent  {
  _model;
  get model()  {
    return this._model? this.decimalPipe.transform(this._model,'2.'): 0;
  };
  set model(val)  {
    this._model = val ? this.toNumberPipe.transform(val): 0;
  };
  constructor(
    private toNumberPipe: ToNumberPipe,
    private decimalPipe: DecimalPipe,
  ) {}
}