函数内的Angular 2 ngModel

Question

我正在尝试将ngModel传递给函数并获得更改,

我不知道使用的方式.

这就是我现在得到的:

          <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>

.... 等等...

然后在我的page.ts我得到了

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);
}

我不想这样做:

this.monday = this.clientAction.transformInput(input);

因为你可能认为我一整天都这样,所以我不想每天都有这样的功能:

onChangeMonday(){};
onChangeTuesday(){};

我需要动态的东西.

我该如何解决这个问题？

提前致谢

[解决方案] @ AJT_82

而不是使用我的ngModel并尝试更新它,解决方案是从表单访问控件.

在您的page.html中

      <ion-input text-right
           formControlName="monday"
           type="number" pattern="[0-9]*"
           placeholder="00.00"
           [(ngModel)]="monday"
           (keypress)="onChange(monday, 'monday')">
       </ion-input>

然后在你的page.ts

onChange(input: string, day: string){
this.rateForm.controls[day].setValue(this.clientAction.transformInput(input));
}

现在就像魅力一样! 谢谢@ AJT_82

Answer 1

既然您有表格，我建议您完全跳过ngModels并使用您拥有的表格。仍然有点不确定应this.clientAction.transformInput(input)该做什么，以某种方式转换这些值，正如您所解释的那样。也许当您提交表格时，您应该能够合并这一点？无论如何，如上所述，您将表单值安全地存储在表单创建的对象中，这对您来说看起来像这样：

{
  "monday":null,
  "tuesday":null,
  "wednesday":null,
  // ... and so on
}

当您在字段中输入时，您可以使用 捕获每次按键valueChanges，您可以在其中访问完整的表单：

this.myForm.valueChanges.subscribe(res => {
  console.log("all form values: ", res) // here is an object with all your form values
})

当您需要时，您还可以通过以下方式访问每个表单控件，这里访问星期一：

  console.log(this.myForm.controls['monday'].value) 

因此，这消除了使用ngModel每个表单值的麻烦。

因此，您可以通过以下几种方法来拦截这些值，然后在您想要/需要的时候“转换”它们。这样做的最佳位置可能是在提交表单时，循环值并转换它们。这完全是动态的，正如您所希望的，不需要 7 个函数来转换每个表单控件！;)

希望这对您有帮助，这是一个笨蛋（也请检查控制台）。

普朗克