每次初始化组件时从 Behavior Subject 接收多个数据实例

Question

我有一个简单的路由器，我在其中调用服务并从行为主题接收数据...当我导航到另一条路线并返回时，我从主题接收多个值...我怎样才能销毁所有一个主题的观察者并在我需要时创建新主题...？这是 plunker 演示 http://plnkr.co/edit/OKiljCekSKHO1zJF5MAy?p=preview
我打算在 ngOnDestroy 中销毁一个主题的观察者...

  ngOnDestroy(){
this.srvc.DestroySubject();
 }

谁能告诉我如何摧毁一个行为主体的观察者？

Answer 1

这种行为是预期的。

export class Sample1 {
  constructor(public srvc:HeroService) {
      this.srvc.Data.subscribe(data=> {
        console.log(data);
      });
      this.srvc.GetData();
  }
}

在您订阅srvc.Data 的构造函数中，因为Data 是BehaviorSubject，它返回最近发出的值。你用null初始化Data，所以一开始没有数据。

然后在构造函数中调用this.srvc.GetData() 这会导致一个事件被发出并被订阅接收（前面的行）。

如果您导航离开并返回，则 Sample1 会再次初始化并执行构造函数。第一件事是订阅srvc.Data。它从上次调用GetData()（当我们第一次导航到Heroes时）获取最后一个发出的值，即Received Data。

接下来是对this.srvc.GetData() 的调用，它再次发出Received Data，并且订阅传递了这个值。

解决方法

要修复它，您可以将调用 this.srvc.GetData(); 转移到服务，而不是像

@Injectable()
export class HeroService {
  Data: BehaviorSubject<RepairOrder> = new BehaviorSubject(null);

  constructor() {
    this.GetData();
  }

  GetData(){
    this.Data.next('Recieved Data');
  }
  DestroySubject(){
    //alert('hi');
  }
}

Plunker example