RxJS，Angular：无法通过其他方式接收订阅结果

Question

我有一个这样的 Angular 组件：

它创建一个普通的ReplaySubject。（参见 constructor）。然后一些其他组件通过方法 getSubject() 获取 subject 并订阅它。另一个组件通过 setValue 设置一个新值。该值应由订阅者接收。但是，这不会发生。它什么也没收到，甚至没有错误。

@Injectable()
export class BreadcrumbService {

    subject: ReplaySubject<string>;

    constructor() {
        this.subject = new ReplaySubject<string>();
        console.log('Step 1: Subject created');
    }

    getSubject(): ReplaySubject<string> {
        console.log('Step 2: Return subject for subscribing');
        return this.subject;
    }

    setValue(title: string) {
        console.log('Step 3: Invoke a new value which should be received in the Subscriber of step 2.');
        this.subject.next(title);
    }
}

如果我将订阅放在 setValue() 中，它会按预期工作。

这是我应该接收订阅的组件：

export class BreadcrumbComponent implements OnInit {

    constructor(
        private breadcrumbsService: BreadcrumbService
    ) {}

    ngOnInit() {
        this.breadcrumbsService.getSubject()
            .subscribe(
                success => {
                    console.log(success); // is never called
                },
                error => {
                    console.log(error); // is never called
                }
            );
    }
}

我的订阅者如何获得这个值？

Answer 1

我没有发现错误，但是我假设您不止一次提供 BreadcrumbService。
Angular2 为每个提供者维护一个实例。如果您提供不止一次，将会有多个实例。我假设调用 setValue 的实例是在与 BreadcrumbComponent 不同的实例上执行的。

如果您想要共享实例，请在公共父级（例如根组件）处提供它。

Answer 2

请尝试使用 Observables。

@Injectable()
export class BreadcrumbService {

   subject: Observables<string>;

   constructor() {
       this.subject = new Observables<string>();
       console.log('Step 1: Subject created');
   }

   getSubject(): Observables<string> {
       console.log('Step 2: Return subject for subscribing');
       return this.subject;
   }

   setValue(title: string) {
       console.log('Step 3: Invoke a new value which should be received in the Subscriber of step 2.');
       this.subject.emit(title);
   }
}

RxJS，Angular：无法通过其他方式接收订阅结果

RxJS, Angular: Cannot receive result of subscription in other methods

observable

rxjs

rxjs5

angular