首页 > 解决方案 > 为什么我的切换输入 UI 没有正确更新?

问题描述

我正在使用 Ionic 来显示一个表单——它工作正常。我无法让 UI 反映正确的值。

我得到了正确的值:

"optionOne":1,"optionTwo":0

这应该告诉我的 UI 必须optionOne被检查,并且optionTwo不能被检查。

这是我获取值的方式:

.ts

 ....

 public myFormorm: FormGroup;

 constructor() {
     ...
     this.myObject = this.navParams.get('myObject');

     let foo = {
         id: this.myObject.id,
         title: this.myObject.title,
         optionOne: this.myObject.optionOne,
         optionTwo: this.myObject.optionTwo
     }

    this.myFormorm = this.formBuilder.group({
        title: [foo.title, Validators.compose([Validators.required])],
        optionOne: [foo.optionOne],
        optionTwo: [foo.optionTwo],
  });
 }

这些值都是正确的;我只是想念如何正确设置切换组件。如果我进行更改并执行 a PUT,则更新后的值会正确返回。

如果我刷新整个页面,一切都很好。

.html

<ion-item>
  <ion-label stacked>Option One</ion-label>
  <ion-toggle formControlName="optionOne"></ion-toggle>
</ion-item>

我尝试[checked]在切换输入上使用不同的变体,但如果我创建一个新对象而不是 put,我会得到一个foo.optionOne不存在的错误(这很有意义)。

标签: ionic3toggletogglebutton

解决方案


推荐阅读