我正在通过这本官方食谱学习Angular2。
下面的代码是突然出现的。为什么"missionannounce $"没有变量声明?let missionannounce $ =…下面代码的逻辑是什么?
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
@Injectable()
export class MissionService {
// Observable string sources
private missionAnnouncedSource = new Subject<string>();
private missionConfirmedSource = new Subject<string>();
// Observable string streams
missionAnnounced$ = this.missionAnnouncedSource.asObservable();
missionConfirmed$ = this.missionConfirmedSource.asObservable();
// Service message commands
announceMission(mission: string) {
this.missionAnnouncedSource.next(mission);
}
confirmMission(astronaut: string) {
this.missionConfirmedSource.next(astronaut);
}
}
一个Observable
只允许订阅,而一个Subject
允许发布和订阅(主题是一个可观察对象)。因此,使用Subject
允许您的服务同时用作发布者和订阅者。
@Component({})
class ComponentOne {
constructor(private service: MissionService) {}
onClick() {
service.announceMission('mission started');
}
}
@Component({})
class ComponentTwo {
constructor(private service: MissionService) {
service.missionAnnounced$.subscribe(mission => console.log(mission))
}
}
@Component({})
class ComponentThree {
constructor(private service: MissionService) {
service.missionAnnounced$.subscribe(mission => console.log(mission))
}
}
现在每个想订阅任务宣布事件的人都可以订阅。ComponentOne
将是发射任务宣布事件的一个。
为什么" missionannounce $"没有变量声明?
。missionAnnounced$
是变量名,被赋值为Subject
的可观察形式。类成员变量不使用let
下面代码的逻辑是什么?
订阅者订阅可观察对象($
变量),而发布者调用announceMission
和confirmMission
。missionAnnounced$
和missionConfirmed$
的所有订阅者将分别收到这些事件。
为了补充前面的答案,您将在以下SO链接中找到充足的细节:不同RxJS主题的语义是什么?
简而言之,Rxjs主题实现了Observable
和Observer
接口(参见链接了解更多关于主题的不同风格和行为的详细信息)。这里使用的标准主题充当管道,并通过其Observable
接口传递其在Observer
接口上接收到的所有值。你在代码中看到的asObservable
函数调用隐藏了Observer
接口的实现,所以你不能在不应该的时候无意中使用它,也就是说,你只能像使用任何常规的可观察对象一样使用这个主题。