在 Angular2 ngModel 中,值未在自定义指令的 onBlur 事件上更新
In Angular2 ngModel value not updating on onBlur event of custom directive
我开发了一个自定义指令,其中 trims 输入控件的值。
请找到相同的代码:
import { Directive, HostListener, Provider } from '@angular/core';
import { NgModel } from '@angular/forms';
@Directive({
selector: '[ngModel][trim]',
providers: [NgModel],
host: {
'(ngModelChange)': 'onInputChange($event)',
'(blur)': 'onBlur($event)'
}
})
export class TrimValueAccessor {
onChange = (_) => { };
private el: any;
private newValue: any;
constructor(private model: NgModel) {
this.el = model;
}
onInputChange(event) {
this.newValue = event;
console.log(this.newValue);
}
onBlur(event) {
this.model.valueAccessor.writeValue(this.newValue.trim());
}
}
问题是 ngModel 没有更新 onBlur 事件的值。
我尝试在 onModelChange 事件上设置 trim 值,但它不允许在两个词之间使用 space(例如,ABC XYZ)
任何建议都会有所帮助。
请在 onblur 事件中添加以下代码行,而不是现有的 code.It 行:
this.model.control.setValue(this.newValue.trim());
谢谢!
我开发了一个自定义指令,其中 trims 输入控件的值。 请找到相同的代码:
import { Directive, HostListener, Provider } from '@angular/core';
import { NgModel } from '@angular/forms';
@Directive({
selector: '[ngModel][trim]',
providers: [NgModel],
host: {
'(ngModelChange)': 'onInputChange($event)',
'(blur)': 'onBlur($event)'
}
})
export class TrimValueAccessor {
onChange = (_) => { };
private el: any;
private newValue: any;
constructor(private model: NgModel) {
this.el = model;
}
onInputChange(event) {
this.newValue = event;
console.log(this.newValue);
}
onBlur(event) {
this.model.valueAccessor.writeValue(this.newValue.trim());
}
}
问题是 ngModel 没有更新 onBlur 事件的值。 我尝试在 onModelChange 事件上设置 trim 值,但它不允许在两个词之间使用 space(例如,ABC XYZ)
任何建议都会有所帮助。
请在 onblur 事件中添加以下代码行,而不是现有的 code.It 行:
this.model.control.setValue(this.newValue.trim());
谢谢!