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>

....等等......

然后在我的页面中我得到了

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的麻烦。

所以这些可以通过几种方式拦截价值，然后转换＆＃34;他们在某些时候，当你想要/需要时。可能最好的地方就是提交表单，循环值并转换它们。这是完全动态的，正如您所希望的那样，并且不需要7个函数来转换每个表单控件！ ;）

希望这会对你有所帮助，而且这里也是一名队员（也请检查控制台）。

Plunker

Answer 2

当您使用ngModel时，为什么要将相同的内容传递给函数

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

并使用ngModel本身作为

进行处理

onChange(){
    input = this.clientAction.transformInput(this.monday);
}

更新1：

我让你正在寻找用户输入文本框值的变换值。的 Check Custom Directive

函数

2 个答案:

Plunker