Angular 2 订阅不工作

Question

由于超出此问题范围的原因，我不得不停止使用 @injectable。我转换了使用它的服务，只是手动更新它们而不是使用 @injectable 它适用于所有服务，除了我使用 subscribe 的服务我使用订阅的服务在我不得不删除之前确实有效@injectable。我可以在没有 @injectable 的情况下让它工作吗？

代码：

服务：

import { Subject } from 'rxjs/Subject';

export class ResultSelectionService {
  // Observable string sources
  private resultSelectedSource = new Subject();
  // Observable string streams
  resultSelected$ = this.resultSelectedSource.asObservable();
  // Service message commands
  selectResult(result: any, place: any) {
    this.resultSelectedSource.next({result: result, place: place});
  }
}

服务用户（selectResult 函数执行 - 好）：

//arrow function because when called above "this" is an html element
resultClick = (event) => {
    this.resultSelectionService.selectResult(event.data.result, event.data.place);
}

应该执行但没有执行的方法（代码永远不会进入 result => {:

constructor( ) {
this.resultSelectionService = new ResultSelectionService();
    this.resultSelectionService.resultSelected$.subscribe(
        result => {

            this.selectedResult = { result };

            $('#result-details-modal').appendTo("body").modal('show');

            $('#result-details-modal').on('shown.bs.modal', (e) => {
                this.resizeMap();
                this.canGetAddress = true;
                this.addMarkersToMap(this.map);
                //this.bindAutoCompleteToMap();
            })
            console.log(this.selectedResult.result);
        });
}

我可以在不使用 @injectable 的情况下执行订阅的功能吗？如果没有，我该如何解决这个问题，创建类似的东西？

Answer 1

这里您需要的是 ResultSelectionService 的单个实例，这就是为什么您的订阅方法永远不会被调用的原因。

您需要在 ResultSelectionService 上添加 @Injectable()，将其添加到您的 forRoot() 模块方法中（或者直接在 AppModule 的提供程序中添加，如果它是您唯一的模块有）并像那样使用它：

constructor( private resultSelectionService:ResultSelectionService ) {
    this.resultSelectionService.resultSelected$.subscribe(
        result => {

            this.selectedResult = { result };

            $('#result-details-modal').appendTo("body").modal('show');

            $('#result-details-modal').on('shown.bs.modal', (e) => {
                this.resizeMap();
                this.canGetAddress = true;
                this.addMarkersToMap(this.map);
                //this.bindAutoCompleteToMap();
            })
            console.log(this.selectedResult.result);
        });
}

这样一来，您将确保在您的应用中各处只提供一个 ResultSelectionService 实例，并且您将能够从任何地方触发 observable。

Angular 2 订阅不工作

Angular 2 subscribe not working

subscribe

angular