Question

其实我想知道我做错了什么

我的组件中有这行代码返回observable

this.items$ = this.dataFetchService.getItems();

和模板

<div *ngFor="let item of items$ | async">
<div>{{item.name}}</div>
</div>

我需要将一些新值推送到这个数组，它们来自应用程序的其他部分，而不是来自api。那么我究竟能如何表现呢？因为如果我想使用push，或类似的东西，它说这个函数不存在，但是什么可以替代它在observable？

我的服务只是拿着一些EvenetEmitters，一个组件发出，另一个正在抓住这个。

在使用async pipe之前，就像这样

this.dataTransferService.newItem.subscribe(res => this.items.push(res))

this.dataFetchService.subscribe(res => this.items = res)

工作正常，但我想重新设计它。

Answer 1

这会有用吗？

 export class AppComponent  {

  items$ : Subject<any[]>;

  constructor(service:Service) {   
  }

ngOnInit(){
  Observable
  .forkJoin(this.items$, this.service.get())
  .map(([current, added]) => [...current, ...added])
  .subscribe((newData)=>{
       this.items$.next(newData)
  });
}
}

编辑：使用combineLatest而不是像@ Jota.Toledo指出的ForkJoin

 export class AppComponent  {

  items$ : Subject<any[]>;

  constructor(service:Service) {   
  }

ngOnInit(){
  Observable
  .combineLatest(this.items$, this.service.get())
  .map(([current, added]) => [...current, ...added])
  .subscribe((newData)=>{
       this.items$.next(newData)
  });
}
}

Answer 2

您可能需要的是服务中的一项功能，它会更改服务中的数据，以及另一次调用getItems（）。

你能详细说明一下情况吗？

Angular 4 AsyncPipe不允许我更改数据

2 个答案: