javascript - Angular .js : ngSwitch to show/hide rather than add/remove DOM elements

Question

正如我最近发现的那样，ngSwitch 的行为有点像 ngIf，因为它会直接从 DOM 中删除元素，而不是仅仅隐藏它们。现在，在我的应用程序中，这让我感到震惊，因为这既不必要地昂贵又可能会导致问题(如果我需要访问隐藏的 DOM 元素的属性)。同时，我喜欢 ngSwitch 语法的简洁性，而不是一堆不同的 ngShow 指令(这也不允许我包含“默认”行为) .有什么方法可以修改此指令的工作方式，使其仅隐藏元素，而不是完全删除它们？谢谢。

Answer 1

好的，我更了解你的需求，我以前也有同样的需求。我建议您将 ngSwitch 与这样的自定义指令一起使用:

<div ng-switch="mode">
  <directive-a ng-switch-when="a"></directive-a>
  <directive-b ng-switch-when="b">...</directive-b>
  <directive-c ng-switch-default>...</directive-c>
</div>

并且在您的指令 directiveA、directiveB 和 directiveC 的定义中，您使用 templateUrl，它将使用指令第二次调用的缓存。

第二种方法是在每个指令上使用 ng-show，但我更喜欢 ng-switch，因为它让 dom 更轻。