带有远程数据的 Ionic2 段



我在页面中有以下代码来显示 Ionic 2 应用程序的 2 个片段。

  <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(,但它没有任何影响。

您应该改用ionSelect(文档(:

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

检查分段 API 文档。 ionChange是由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事件。

相关内容

  • 没有找到相关文章

最新更新