使用 ng-switch 时如何防止控制器重新加载答案

【问题标题】：How to prevent controller reloading when using ng-switch使用 ng-switch 时如何防止控制器重新加载
【发布时间】：2023-03-24 20:37:01
【问题描述】：

在这个例子中，使用 ng-switch，我可以在不同的视图之间切换。每个视图都分配有一个控制器。

我在网上放了一个快速示例：http://jsfiddle.net/FBHjZ/1/

看起来每次我切换视图时控制器都会重新实例化：如果您在输入字段中输入 val，返回首页并切换回设置，则该值丢失。

如何防止这种情况发生？基本上，我想要的是在视图之间切换时保持以前视图的状态。

【问题讨论】：

如果你真的对维护它们的状态感兴趣，为什么不直接使用 ng-show 和 ng-hide 来切换它们的可见性呢？您还可以使用自定义指令来模板/控制您的视图，这将允许指令与其主机页面之间的两种方式绑定，从而持久化数据。
谢谢，这就是我要找的。另一个问题，当显示一个元素时，我可以听到一个事件吗？（然后调用控制器上的方法）

【解决方案1】：

无法阻止现有的ngSwitch 重新实例化控制器并重新创建新范围。正如documentation 中所指出的，该指令正在创建一个新范围，并实际创建/销毁相应的 DOM 元素。

如果您的目标是保留状态，只需将其放入父范围之一，请检查此 jsFiddle： http://jsfiddle.net/FBHjZ/2/

另一种方法是为共享模型使用服务。

【讨论】：

嗯，我明白了。所以我现在将使用 blesh 的 ng-show/ng-hide 解决方案，因为我想避免每次都重绘屏幕。但是您的解决方案也可以。
是的，ng-show/ng-hide 适用于屏幕的一小部分。对于更大的 DOM 片段，使用 ngSwitch 可能会更好（因为它正在添加/删除 DOM 元素，因此整个 DOM 树更轻）。一切都取决于用例，但既然你问过 ngSwitch :-)
是的，但是回到之前的状态可能会变得难以处理。有没有办法保留元素的先前范围并重新注入它而不是创建一个新的？我的应用程序由多个选项卡和子选项卡组成，在服务中保存每个选项卡的状态似乎很难管理
在这种情况下，将您的状态放在父范围之一中，如附加到响应的 jsFiddle 中。这就像“保存状态”