Angular 2在指令中获取用户输入答案

【问题标题】：Angular 2 get user input in directiveAngular 2在指令中获取用户输入
【发布时间】：2016-11-13 18:53:57
【问题描述】：

我尝试创建一个仅数字/数字输入指令，这意味着我想允许输入，例如：451,45 或 451.45

目前该指令如下所示：

import {Directive, ElementRef, HostListener, Input} from '@angular/core';

@Directive({
selector: '[numbers-only]'
})

export class NumbersOnlyDirective {
private el: HTMLElement;

constructor(el: ElementRef) {
    this.el = el.nativeElement;
}

@HostListener('keydown', ['$event']) onKeyDown(e: Event) {

 }
}

下一步是获取元素的当前值，并在每次按键按下事件时重新格式化。我的问题：如何获取指令的当前值，我不知道如何从 ElementRef 中获取它。格式化输入的最佳方法是什么： Regex ？

感谢您的耐心和想法！

【问题讨论】：

标签： angular directive

【解决方案1】：

您可以使用 keyup 事件，因为这是更新值的时间。而且您不需要RegEx，因为您只需检查keyCode 的范围即可。看到这个 plunkr：

http://plnkr.co/edit/xyAy2KjPia1qncqAcpMj?p=preview&open=app%2Fapp.component.ts

【讨论】：