Estoy tratando de pasar un ngModel a una función y obtener el cambio,
No sé la forma de usar.
esto es lo que tengo ahora:
<ion-input text-right formControlName="monday" type="number" pattern="[0-9]*" placeholder="00.00" [(ngModel)]="monday" (keypress)="onChange(monday)"> </ion-input> <ion-input text-right formControlName="tuesday" type="number" pattern="[0-9]*" placeholder="00.00" [(ngModel)]="tueasday" (keypress)="onChange(tuesday)"> </ion-input>.... y así...
Luego en mi page.ts obtuve
monday: string = ''; tuesday: string = ''; etc... onChange(input: string){ //I want the input to correspond to my ngModel so it gets updated input = this.clientAction.transformInput(input); }no quiero hacer:
this.monday = this.clientAction.transformInput(input);Porque, como pueden pensar, tengo todos los días de la semana, así que no quiero tener una función para todos los días como:
onChangeMonday(){}; onChangeTuesday(){};Necesito algo dinámico.
¿Cómo puedo resolver este problema?
Gracias por adelantado
[SOLUCIÓN] @AJT_82
en lugar de usar mi ngModel e intentar actualizarlo, la solución fue acceder a los controles desde el formulario.
en su página.html
<ion-input text-right formControlName="monday" type="number" pattern="[0-9]*" placeholder="00.00" [(ngModel)]="monday" (keypress)="onChange(monday, 'monday')"> </ion-input>luego en tu página.ts
onChange(input: string, day: string){ this.rateForm.controls[day].setValue(this.clientAction.transformInput(input)); }Funciona como un encanto ahora !! Gracias @AJT_82
Como tiene un formulario, le sugiero que omita los ngModels por completo y utilice el formulario que tiene. Todavía no estoy seguro de lo que se supone que debe hacer this.clientAction.transformInput(input) , transforma los valores de alguna manera, como explicaste. Debería poder incorporar esto, ¿quizás cuando envíe el formulario? De todos modos, como se dijo, tiene los valores de su formulario almacenados de forma segura en el objeto creado por el formulario, que para usted se vería así:
{ "monday":null, "tuesday":null, "wednesday":null, // ... and so on } Cuando escribe en sus campos, puede capturar cada pulsación de tecla con valueChanges , donde puede acceder al formulario completo:
this.myForm.valueChanges.subscribe(res => { console.log("all form values: ", res) // here is an object with all your form values })Cuando lo necesites, también puedes acceder a cada control de formulario, aquí accediendo a lunes:
console.log(this.myForm.controls['monday'].value) Así que esto se deshace de la molestia de usar ngModel para cada valor de formulario.
Entonces, estas son algunas formas en que puede interceptar los valores y luego "transformarlos" en algún momento, cuando lo desee o lo necesite. Probablemente el mejor lugar para hacerlo es al enviar el formulario, repetir los valores y transformarlos. ¡Y esto es totalmente dinámico, como usted deseaba, y no necesita 7 funciones para transformar cada control de formulario! ;)
Espero que esto te ayude, y aquí hay un plunker (revisa también la consola).
Cuando usa ngModel, ¿por qué quiere pasar lo mismo a la función?
<ion-input text-right formControlName="monday" type="number" pattern="[0-9]*" placeholder="00.00" [(ngModel)]="monday" (keypress)="onChange()"> </ion-input>y manejar usando el propio ngModel como
onChange(){ input = this.clientAction.transformInput(this.monday); }Actualización 1:
Obtuve que está buscando transformar el valor del cuadro de texto a medida que el usuario lo escribe. Consultar directiva personalizada