不能过滤RxJS可观察到的Angular2

下面是从一个REST服务获取数据的一个片段：不能过滤RxJS可观察到的Angular2

getPlayers(position: string) { 
    return this.get(`players/${position}`) 
     .map(r => r.data) 
     .catch(error => { 
      console.log('Error: ', error); 
      return Observable.of<Player>(); 
     }); 
}

r.data是玩家的数组。

这是我的定义将保持参考一下以上的回报服务的变量：

players: Observable<Player>;

最后，这是我如何分配球员：

this.players = this.svc.getPlayers(this.position);

这是怎么了我列出组件上的玩家：

<ion-item *ngFor="let player of players | async"> 
    {{player.name}}-{{player.position}} 
</ion-item>

一切按预期工作。现在，我想在向组件展示它们之前过滤这些播放器，然后尝试类似这样的操作;

this.players = this.svc.getPlayers(this.position).filter(p => p.position === 'hq');

......我在屏幕上什么都看不到，就好像我没有任何记录显示。没有一种可观察的方法似乎能够正确工作。

任何想法为什么？

来源

2016-10-01 Élodie Petit

能否请您确认，如果过滤的数据有数组中的任何元素？ – WelsonJR

尝试用以下应用过滤器：

更改您的服务如下：

getPlayers(position: string) { 
    return this.get(`players/${position}`) 
     .map(r => r.json()) 
     .catch(error => { 
      console.log('Error: ', error); 
      return []; 
     }); 
}

//在您的组件：

players: Player[]; 

//Call your service to get data and remove async pipe from HTML 
this.svc.getPlayers(this.position).subscribe(res => { 
    this.players = (res.data.length) ? res.data.filter(p => p.position === 'hq'):[]; 
});

来源

2016-10-01 05:58:44 ranakrunal9

“玩家”是一个可观察对象。因此，我们需要将其更改为'array'，并从视图 – yurzui

中删除'async'管道。似乎通过单独使用Subscribe，服务永远不会被调用。同样，通过从模板中删除“异步”管道，我得到“无法找到类型为'object'的不同支持对象'[object Object]'。NgFor仅支持绑定到数组，例如Arrays。 –

将'r => r.data'更改为'r => r.json（）。data'并检查对象错误是否已解决 – ranakrunal9

.map(r => r.data.filter(p => p.position === 'hq')) 

this.players = this.svc.getPlayers(this.position);

来源

2016-10-01 06:04:08 micronyks

不能过滤RxJS可观察到的Angular2

回答

相关问题