无法在 Ionic 2 段中绑定 toggleSwitch答案

【问题标题】：Impossible to bind toggleSwitch in a segment Ionic 2无法在 Ionic 2 段中绑定 toggleSwitch
【发布时间】：2017-11-21 04:37:13
【问题描述】：

我在一个段中实现了一个切换开关如下：

<ion-menu [content]="content" side="left" id="menuParameter">
    <ion-header>
        <ion-toolbar color="default">
            <ion-segment [(ngModel)]="menu">                            
                <ion-segment-button value="segment1">
                    <ion-title> 
                        Segment1 without toggle (initialization segment)
                    </ion-title> 
                </ion-segment-button>
                <ion-segment-button value="segment2">
                    <ion-title>  
                        Segment 2 with toggle switch 
                    </ion-title>
                </ion-segment-button>
            </ion-segment> 
        </ion-toolbar>  
    </ion-header>

    <ion-content>     
        <div [ngSwitch]="menu">                        
        <ion-list *ngSwitchCase="'segment1'">
              By default here we are
        </ion-list>    
        <ion-list *ngSwitchCase="'segment2'">
        <!--impossible to bind because by default i am not in segment 2 but in segment 1, so the toggle switch is not set with true value-->
                <ion-item>
                        <ion-label>There will be cake</ion-label>
                        <ion-label> {{isToggledd}} </ion-label>
                        <ion-toggle [(ngModel)]="isToggled" (ionChange)="notify()"></ion-toggle>
                    </ion-item>
               
            </ion-list>
        </div>
    </ion-content>
</ion-menu>

这是我的控制器：

export class AppComponent {
      rootPage:any = HomePage;
      public isToggled: boolean;
      public menu: string = 'segment1'; /*show segment1 by default*/                                   
      constructor(
        public platform: Platform,
        public statusBar: StatusBar) {}

        this.isToggled = true; /*toggle Switch set as TRUE*/
      public notify() {
        console.log("Toggled: "+ this.isToggled); 
      }}

所以我希望在我的 SEGMENT2 中这样做

但我得到的行为如下：

但令人惊讶的是，如果将切换开关移动到第 1 段，切换行为是正常的：

请注意，Toggle 值始终为“true”。

有什么帮助吗？

【问题讨论】：

你需要把this.isToggled = true;放在构造函数括号{this.isToggled = true;}
是的，我试过了，但行为相同。切换值如预期的“true”，但切换光标的位置显示为“off”
我运行了你的代码，它运行良好。
你说得对，它在我的 home.html 中有效，但在我的左侧菜单中无效。
只是我做的一个测试。在我的左侧菜单中，我实现了 3 个切换（真、假、假）在我的段 2 中未初始化。我切换第二个切换，然后第一个切换切换到“真”。我有（真，真，假）。当我单击第 1 段并返回第 2 段时，我总是有（真、真、假）值，但每个切换都处于关闭位置。很奇怪

标签： ionic2 toggle segment

【解决方案1】：

在段 2 上单击两次就可以了。所以有可能以编程方式自动触发第二次点击（选中时第二次点击段 2 按钮）？

【讨论】：