我正在使用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;
}
}


它运行模糊事件。
但是我想在为每个输入加载表单上的信息时执行,是否有人知道如何执行此操作?

最佳答案

您可以使用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来检查值何时更改。

您还可以发布指令在代码中的调用方式

关于javascript - 指示负载信息,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36507596/

10-16 05:03