2017-04-08 3 views
0

Ionic 2アプリケーションで2つのセグメントを表示するために、次のコードをページに表示しています。リモートデータを持つIonic2セグメント

<div padding> 
    <ion-segment [(ngModel)]="userType"> 
     <ion-segment-button value="latest"> 
     Latest 
     </ion-segment-button> 
     <ion-segment-button value="online" (ionChange)="getOnlineUsers()" > 
     Online 
     </ion-segment-button> 
    </ion-segment> 
    </div> 

    <div [ngSwitch]="userType"> 
    <ion-list *ngSwitchCase="'latest'"> 
     <ion-item *ngFor="let user of allUsers"> 
     <ion-avatar item-left> 
      <img src="{{user.avatar}}"> 
     </ion-avatar> 
     <h2>{{ user.title }}</h2> 
     <p>{{ user.activityStamp | amFromUnix }} - {{user.online}}</p> 
     </ion-item> 
    </ion-list> 

    <ion-list *ngSwitchCase="'online'"> 
     <ion-item *ngFor="let user of onlineUsers"> 
     <ion-avatar item-left> 
      <img src="{{user.avatar}}"> 
     </ion-avatar> 
     <h2>{{ user.title }}</h2> 
     </ion-item> 
    </ion-list> 
    </div> 

質問:私は "オンライン" セグメントをクリックすると

、リモート呼び出しは、オンラインユーザーのみを取得するために起こるはず。私は(ionChange)を使用していますが、影響はありません。

答えて

1

あなたはionSelectdocs)の代わりを使用する必要があります。

<div padding> 
    <ion-segment [(ngModel)]="userType"> 
     <ion-segment-button value="latest"> 
     Latest 
     </ion-segment-button> 
     <ion-segment-button value="online" (ionSelect)="getOnlineUsers()" > 
     Online 
     </ion-segment-button> 
    </ion-segment> 
    </div> 
1

チェックセグメントAPI docsionChangeは、ion-segmentではなく、ion-segment-buttonによって放出されます。

の操作を行います。

<ion-segment [(ngModel)]="userType"> 
     <ion-segment-button value="latest"> 
     Latest 
     </ion-segment-button> 
     <ion-segment-button value="online" (ionSelect)="getOnlineUsers()"> 
     Online 
     </ion-segment-button> 
    </ion-segment> 

使用ionSelectイベント。

+0

ああ、我々は同じ時間@surajで同じ答えを投稿しました。申し訳ありません... – sebaferreras

+1

これは起こります...これはまっすぐ前方にあった.. –

+0

私はこれに気づくためにとても愚かだった:) – Purus

関連する問題