首页 文章

RxJ从可观察中获得 Value

提问于
浏览 次
16

在组件中：

singleEvent$: Observable<Event>;

在init，我得到了可观察性

this.singleEvent$ = this._eventService.events$
  .map(function (events) {
    let eventObject = events.find(item => item.id === eventid);
    let eventClass: Event = new Event(eventObject);
    return eventClass;
  });

我怎样才能获得像 event.name 这样的当前值？

typescript angular rxjs observable

2 回答

  • 29

    要从可观察的数据中获取数据，您需要订阅：

    this.singleEvents$.subscribe(event => this.event = event);

    在模板中，您可以使用 | async 管道直接绑定到observable：

    {{singleEvents$ | async}}
    回复于
  • 3

    要添加到GünterZöbauer的答案，如果您希望同步获取Observable中的值，可以使用BehaviorSubject .

    BehaviorSubject是一个始终具有值的Observable，您可以调用 myBehaviorSubject.getValue() 或 myBehaviorSubject.value 来同步检索BehaviorSubject当前持有的值 .

    由于它本身也是一个可观察的，你仍然可以订阅BehaviorSubject以异步地响应它所拥有的值的变化（例如 myBehaviorSubject.subscribe(event => { this.event = event }) ）并在组件的模板中使用异步管道（例如 {{ myBehaviorSubject | async }} ） .

    以下是与给定示例匹配的一些用法，用于在给定服务的组件中创建BehaviorSubject：

    @Component({
  //...
})
export class YourComponent implements OnInit {
  singleEvent$: BehaviorSubject<Event>;

  constructor(private eventService: EventService){}

  ngOnInit(){
    const eventid = 'id'; // <-- actual id could go here
    this.eventService.events$
      .pipe(
        map(events => {
          let eventObject = events.find(item => item.id === eventid);
          let eventClass: Event = new Event(eventObject);
          return eventClass;
        })
      )
      .subscribe(event => {
        if(!this.singleEvent$){
          this.singleEvent$ = new BehaviorSubject(event);
        } else {
          this.singleEvent$.next(event);
        }
      });
  }
}
    回复于

相关问题