代码之家 › 专栏 › 技术社区 › Aymen Kanzari

角度-在输入字段中转换为小写

typescript angular

Aymen Kanzari · 技术社区 · 6 年前

我有一个电子邮件输入,我想当我输入大写字母时,它会把它们转换成小写字母

我试过这种方法,但它显示出我的错误

错误范围错误:超出最大调用堆栈大小

<input type="text" formControlName="mail" (ngModelChange)="toLowerCase($event)">

private toLowerCase(event): void {
    this.cmOrganizationForm.get('mail').setValue(event.toLowerCase());
}

3 回复 | 直到 6 年前

Ashish Ranjan 6 年前

请不要用 ngModelChange 使用反应式窗体时的事件。

倾听 valueChanges 订阅表单控件并设置订阅下的值,使用 emitEvent 如果是假的,它不会发出 价值变化 事件再次发生。

试试这个,这个不行 emit 值再次更改事件

private ngOnInit(): {
  this.cmOrganizationForm.get('mail').valueChanges.subscribe((event) => {
     this.cmOrganizationForm.get('mail').setValue(event.toLowerCase(), {emitEvent: false});
  })
}

Suresh Kumar Ariya 6 年前

我们需要删除模板驱动表单“ngmodel”中应该使用的modelchange事件发射器。

模板:

<input type="text" formControlName="mail">

组件:

ngOnInit(){
  this.form.get('mail').valueChanges.subscribe(event => {
     this.form.get('mail').setValue(event.toLowerCase(), {emitEvent: false});
  });
}

StackBlitz: https://stackblitz.com/edit/angular-wp4tim?file=src%2Fapp%2Fapp.component.ts