我不太清楚这是一个范围界定问题,还是我如何建立我的观测值的问题,但也许你可以帮忙。
首先,我的逻辑。我的总体目标是能够在发送http.get请求之前检查某些数据是否在本地保存。我想做的是返回本地保留的数据(如果它存在的话),我想我可以让这个返回成为一个可观察的,这样我就可以订阅这个函数的输出,而不管它返回的是本地数据还是远程数据。任何关于这一逻辑的想法都将不胜感激!
我跟随this blog post by Cory Rylan来实现我自己的可观察性。我遇到了一个问题,无法在getData函数中定义观察者。
Here is Cory's working demo
Here is my not-working demo-您可以在日志中看到服务中的this._dataObserver未定义,而在cory中则是。这就是引起我问题的原因。
以下是代码片段:
阿普茨

@Component({
  selector: 'my-app',
  template: `
    <landing-page></landing-page>
  `,
  providers: [DataService],
  directives: [LandingPageComponent]
})
export class App {
  constructor() { }
}

bootstrap(App, [HTTP_BINDINGS])
  .catch(err => console.error(err));

登陆页面组件.ts
@Component({
  selector: 'landing-page',
  template : `
    hello
  `,
})
export class LandingPageComponent implements OnInit{
  data : Observable<any[]>;
  constructor(
    private _dataService : DataService
  ) { }

  ngOnInit() {
    this.data = this._dataService.data$;
    this._dataService.getData();
  }
}

数据服务
@Injectable()
export class DataService {

   data$ : Observable<any[]>; // data stream
   private _baseUrl: string;
   private _dataObserver : Observer<any[]>;
   private _dataStore : {
    data : any[]
   };

  constructor (
    private _http: Http
  ) {
    this._baseUrl  = 'http://56e05c3213da80110013eba3.mockapi.io/api';
    this.data$ =  new Observable(observer => this._todosObserver = observer).share();
    this._dataStore = { data: [] };
  }

  /** **************
  * Public functions
  *****************/

  getData () {
    this._http.get(`${this._baseUrl}/todos`)
      .map(data => data.json())
      .subscribe( data => {
      this._dataStore.data = data;
      console.log(this._dataObserver);   //<------ This is undefined for me!
      this._dataObserver.next(this.data);
    },
    error => {
      console.log('couldn\'t load data! ' + error );
    });

  }

}

谢谢你的关心

最佳答案

_dataObserver为空,因为您没有订阅关联的可观察值。别忘了可观测到的是懒惰的…
您可以尝试以下操作:

ngOnInit() {
  this.data = this._dataService.data$.subscribe(data => { // <-----
    console.log(data);
  });
  this._dataService.getData();
}

编辑
此外,您的代码中还有一个拼写错误:
this.data$ =  new Observable(observer => this._todosObserver = observer).share();

您应该使用_dataObserver而不是_todosObserver
this.data$ =  new Observable(observer => this._dataObserver = observer).share();

09-25 17:07