当我离开我的页面并返回我的 Angular 应用程序时，如何重置我的枚举？

如何解决当我离开我的页面并返回我的 Angular 应用程序时，如何重置我的枚举？

我的 Angular 应用程序中出现了一个奇怪的情况，我正在寻找有关如何解决它的建议。我有两个页面可以在它们之间导航。每个页面都是一个组件，每个页面都有一组枚举：

page-1.component.ts

export class Page1Component {
    ...
}

enum myEnums {
    enum1,enum2,enum3,...
}

page-2.component.ts

export class Page2Component {
    ...
}

enum myEnums {
    enumA,enumB,enumC
    ...
}

请注意，枚举是在每个组件类之外定义的，并且它们的名称相同。然而，它们不包含相同的枚举集。

我发现如果我从第 1 页导航到第 2 页并返回，枚举会根据我所在的页面重新定义。因此，如果我在第 1 页上执行 console.log(myEnums)，它会显示我 enum1,enum3。如果我在第 2 页执行 console.log(myEnums)，它会显示我 enumA,enumC。因此，枚举的范围似乎限于每个页面，因此将它们命名为相同的名称没有冲突。

然而，每组枚举似乎都缓存在某处，这样当我离开页面并返回时，它不必重新创建该页面的枚举。我注意到这一点是因为我正在做一些需要在每个页面上动态修改枚举的事情。因此，如果这是第 1 页上的原始枚举集：

enum myEnums {
    enum1,enum3
}

... 我从后端调用中获得额外的值，然后将它们插入到枚举中，结果如下：

enum myEnums {
    enum1,extraEnum1,extraEnum2,extraEnum3
}

我可以这样做，因为在 Javascript 中，枚举只是对象：

{
    enum1: 0,enum2: 1,enum3: 2,0: enum1,1: enum2,2: enum3
}

...我可以像这样添加额外的：

myEnum['xxx'] = 3;
myEnum['3'] = 'xxx';

现在是我的问题。在第 1 页上将额外的枚举添加到 myEnums 后，我导航到第 2 页（我对该页面上的 myEnums 执行相同的操作）然后返回到第 1 页。我发现再次添加额外的枚举后，它将它们添加到除了我在第一次访问时添加的额外枚举。所以它最终看起来像这样：

enum myEnums {
    enum1,extraEnum3,extraEnum4,extraEnum5,extraEnum6
}

（它知道如何动态创建枚举数。）

这告诉我，即使导航离开页面，枚举也会被缓存。即使页面组件在我离开时被销毁，枚举也不会。因此，当我返回页面时，我添加的额外枚举只会堆积在第一次添加的枚举之上。我不想在添加额外的枚举之前检查有多少枚举，因为随着我们开发项目，枚举可能会经常更改，并且必须维护一个硬编码数字来跟踪枚举的数量是很麻烦的。

所以我想知道我是否可以在第 1 页的 ngOnDestroy 中做些什么来将枚举重置为原始集合，或者将它们全部销毁，迫使它在我下次访问第 1 页时从头开始重新创建它们。因为枚举的范围是页面，我应该能够在不影响其他页面上的枚举的情况下重置或销毁它们。有没有人有什么建议？谢谢。