如何在一个组件中几次订阅Angular 2中的服务?

时间:2017-03-22 13:43:45

标签: angular

我的服务第一次工作得很好。当它稍后再次调用时它不起作用。我在NgModule中有服务

这是我的代码

  this._portService.getPortList().subscribe(
      (data) => {
          this.len = data['interfaces-state'].length;
              for (this.i = 0; this.i<this.len;this.i++){
                  this.portListJson.push(data['interfaces-state'][this.i].interface);
                  }
                this.removeONUPorts();
                this.addNames();
              });

我的构造函数

 constructor(private _portService:PortsService, private elRef: ElementRef){
        }

当我尝试从不同的函数调用相同的代码时,它不起作用。

我的服务

  getPortList(){
   return this._http.get(environment.api + "restconf/data/ietf-interfaces:interfaces-state/interface?fields=")
     .map(response => response.json());
};

我的第二个电话

 setONUList(port: Port){
      this.clearLists();
         this._portService.getPortList().subscribe(
             (data) => {
                 this.len = data['interfaces-state'].length;
                     for (this.i = 0; this.i<this.len;this.i++){
                         this.portListJson.push(data['interfaces-state'][this.i].interface);
                         }
                       this.removeONUPorts();
                       this.addNames();
                     });

}

1 个答案:

答案 0 :(得分:0)

我不确定你要在这里完成什么。我不明白为什么你需要来自同一组件的2个订阅。通常,我在组件的构造函数或ngOnInit方法中实例化我的订阅,然后将订阅中的值映射到组件中的本地值,然后可以从任何组件方法访问该值。

所以我会做这样的事情:

      this._portService.getPortList().subscribe(
          (data) => {
                       this.localDataVar = data;
                       ...
                  });

然后在组件方法中,您可以访问localDataVar变量

 setONUList(port: Port){
      this.clearLists();
      this.someFunction(this.localDataVar);  //here you'll have last emitted value of data
}

或者另一种方法是简单地访问后续方法中的当前可观察值,如下所示:

 setONUList(port: Port){
      this.clearLists();
      let curVal = this._portService.getPortList().getValue();
}

我不明白为什么你需要或想要来自同一组件的两个相同的订阅。