用Javascript更改输入值后如何强制Angular 2 [（ngModel）]更改？

Question

我正在尝试将日文半角字符替换为全角字符。

ｳ->ウ

因此，无论何时用户输入半角，我们都必须自动转换为全角。

显而易见的解决方案是设计一个指令来更改按键上的ngModel。 但是我们有一个庞大的代码库，我在想也许@Hostlistener可以更改该值。

@HostListener('document:keyup', ['$event']) onKeydownHandler(event) {
   if (event.target.hasAttribute('type')
       && event.target.attributes['type'].value === 'text') {

    event.target.value = this.changeToFullWidth(event, event.target.value);

  }
}

但是，使用此[(ngModel)]总是后面有一个字符，我知道这是因为我直接触摸HTML元素。

有没有办法做到这一点 ？ 还是我不得不采取更艰辛的方法，在整个项目中向每个输入标签添加指令？

Answer 1

最后，我能够通过以下方式触发模型更改：

targetElement.dispatchEvent(new Event('input'), {bubbles: true});

但是发现它在Edge for CKEditor中不起作用。

为此，我们可以使用指令和模型服务

...
constructor(
        ...
        private model:NgModel,
        ...
    ){
...
onInputChange($event){
...
   this.model.valueAccessor.writeValue(this.changeText(modelValue));
...
}