指令在負載信息

Question

我使用Angular2和我創建了一個指令把口罩上的投入，具體如下：

import {Directive, Attribute} from 'angular2/core'; 
import {NgModel} from 'angular2/common'; 

@Directive({ 
    selector: '[real]', 
    host: { 
     '(blur)': 'onInputChange()'   
    } 
}) 

export class RealDirective { 
    modelValue: string; 
    viewValue: string; 

constructor(public model: NgModel) { 
} 

onInputChange() { 
    this.modelValue = this.model.value.replace(/[^0-9\,]/g,''); 
    this.viewValue = RealDirective.format(this.modelValue); 
    this.model.viewToModelUpdate(this.modelValue); 
    this.model.valueAccessor.writeValue(this.viewValue) 
} 

static format(valor) { 

    if (valor == "") { 
     valor = "0"; 
    } 

    var valorFloat: number = parseFloat(valor.replace(",", ".")); 
    var valorString: string = valorFloat.toFixed(2).toString().replace(".", ","); 

    var valorSemCasasDecimais = valorString.substring(0, valorString.length - 3); 
    var valorArray: string[] = valorSemCasasDecimais.split(""); 

    var casa: number = 0; 

    var valorStringComPontosInvertida: string = ""; 

    for (var i = valorArray.length - 1; i > -1; i--) { 
     valorStringComPontosInvertida = valorStringComPontosInvertida + valorArray[i]; 
     casa = casa + 1; 
     if (casa == 3 && i > 0) { 
      valorStringComPontosInvertida = valorStringComPontosInvertida + "."; 
      casa = 0; 
     } 
    } 

    var valorStringComPontosInvertidaArray: string[] = valorStringComPontosInvertida.split(""); 
    var valorStringComPontosCorreta: string = ""; 

    for (var i = valorStringComPontosInvertidaArray.length - 1; i > -1; i--) { 
     valorStringComPontosCorreta = valorStringComPontosCorreta + valorStringComPontosInvertidaArray[i]; 
    } 

    var valorStringPronta: string = valorStringComPontosCorreta + valorString.substring(valorString.length - 3, valorString.length); 

    return valorStringPronta; 
} 
} 

它運行模糊事件。 但我想執行加載每個輸入的表單上的信息，有沒有人有任何想法如何做到這一點？

Answer 1

您可以使用ngOnInit方法來等待指令被加載。 https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html

例如：

@Directive({ 
    selector: '[real]', 
    host: { 
     '(blur)': 'onInputChange()'   
    } 
}) 

export class RealDirective { 
    modelValue: string; 
    viewValue: string; 

    constructor(public model: NgModel) { 
    } 
    ngOnInit():void { 
    console.log(this.model); 
    } 
} 

如果this.model爲null，你可以考慮使用ngOnChanges代替ngOnInit當值變化來檢查。

也可以發佈指令如何在您的代碼中調用