使用路由时，如何监控Angular 2中变量的状态？

我正在从事Angular 2项目，用户可以在该项目中从一个选项卡导航到另一个选项卡（通过路由）。
在其中一个选项卡上，有一个可折叠的部分。根据布尔变量（默认情况下为false），此部分将隐藏（默认情况下）或显示。但此时，如果用户打开此分区，导航到该选项卡所在的位置，然后再次返回到同一选项卡，则分区将再次隐藏。
我想让用户找到她/他离开时的状态。有什么好方法可以使这成为可能？我尝试使用一个服务，以为它会保持变量的状态不变，但它没有按预期工作。
预期的行为是用户从一个选项卡打开一个可折叠部分，移动到另一个选项卡，返回到第一个选项卡，并且仍然打开可折叠部分。此时，当返回到第一个选项卡时，可折叠部分将返回到其已实例化的状态，该部分已关闭。
多谢各位

从

.component.html

文件中，这里是切换可折叠部分的按钮：

<div>
  <button class="btn btn-default btn-sm" (click)="toggleShowSideMenu()" type="checkbox" id="productList">
    <i [ngClass]="sideMenuIsShown ? 'fa fa-minus-square':'fa fa-plus-square'"></i>
    Products list
  </button>
</div>

从

.service.ts

文件

// Emitter to determine the status of the variable defining whether the side menu is visible or hidden
productListStatus = new EventEmitter<boolean>();

//用于确定定义侧菜单是可见还是隐藏的变量状态的发射器
productListStatus=新的EventEmitter（）；

您可以使用可观察对象

为您效劳

private readonly productListStatus = new BehaviorSubject<boolean>(
    false
  );
productListStatus$ = this.productListStatus.asObservable();

setProductListStatus(newStatus: boolean) :void {
this.productListStatus.next(newStatus);
}

就这样

---

警察局。请记住，管理Observable的订阅以提高性能，我的英语说得不太好抱歉

非常感谢JoSSte的及时反馈不幸的是，此解决方案没有达到我的目标，很可能是因为我的描述不够清楚。基本上，在应用程序的一个页面上，有一个URL：“localhost:4200/a”可以隐藏/显示。当用户取消隐藏此部分并单击打开新URL的另一个选项卡：“localhost:4200/b”，然后恢复到第一个URL“localhost:4200/a”时，该部分将再次隐藏，而我希望它保持打开状态。

private readonly productListStatus = new BehaviorSubject<boolean>(
    false
  );
productListStatus$ = this.productListStatus.asObservable();

setProductListStatus(newStatus: boolean) :void {
this.productListStatus.next(newStatus);
}

ngOnInit() {
  this.linearProductsService.productListStatus$.subscribe(
    (sideMenuStatus: boolean) => {
      this.sideMenuIsShown = sideMenuStatus;
    }
  )
}

toggleShowSideMenu() {
  this.linearProductsService.setProductListStatus(!this.sideMenuIsShown);
}