Css 带有$state.includes的ng显示具有闪烁/闪烁-角度；用户界面路由器

如本文所述，我有以下标记：

<div class='container'>
  <div ng-show='$state.includes('state1')></div>
  <div ng-show='$state.includes('state2')></div>
</div>

现在，当我在两种状态之间切换时，两个div都会显示一眨眼，从而产生难看的眨眼效果

我试着把斗篷从中取出，但没有成功

---

我不能使用ng if，因为我使用的是来自的“粘性状态”，这需要DOM持久化。

$State

将无法在HTML中使用，因此

1） 您可以在Ctrl中执行类似的操作

$scope.state = $state;

但我不推荐这个

2） 在HTML中

---

尽管您已经提到您已经尝试了ng斗篷，但我认为您的问题的正确答案确实是ng斗篷带有：

[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}

样式配置。正如您在示例中所看到的，如您所述，整个视图将闪烁，但是，如果您将“ng-clope”指令添加到：

<div ng-app="myApp">

这将成为：

<div ng-app="myApp" ng-cloak>

您将看到，这正是“ng斗篷”指令的目的

---

希望这个例子能帮助您解决这个问题。

您可以使用ng样式来消除闪烁效果

<div class='container'>
    <div ng-style="{'display': $state.includes('state1') ? 'block' : 'none'}"></div>
    <div ng-style="{'display': $state.includes('state2') ? 'block' : 'none'}"></div>
</div>

---

我不知道为什么ng show会在粘性状态下触发闪烁效果，但这个解决方法解决了这个问题。

您是否尝试过使用

ng animate

设置

ng show

的动画？例如，

.ng hide add{animation:0.5s showdiv ease；}.ng hide remove{animation:0.5s hideDiv ease；}

默认情况下使用备用css类进行隐藏<代码>。默认隐藏的地方应该有一个

显示：无
避免
！重要信息
。隐藏添加延迟，但隐藏移除未延迟。当我将时间设置为2秒左右时，眨眼会变成长眨眼。它显示了一个很好的解决方案，但是通过延迟隐藏移除而不是隐藏添加。只是我不能让它工作。@miguellatuada默认隐藏它根本不显示。我想尝试在$state.includes（）上添加一个带有ng类的类。这就像是在重建ng秀。你发现了这个问题吗？谢谢你的快速回复。我用你的第一个选择。在选项2中，问题仍然存在。谢谢你的代码笔。遗憾的是，它不起作用。当我取下笔中的ng斗篷时，我也看不到任何闪烁。。
<div ng-app="myApp">

<div ng-app="myApp" ng-cloak>

<div class='container'>
    <div ng-style="{'display': $state.includes('state1') ? 'block' : 'none'}"></div>
    <div ng-style="{'display': $state.includes('state2') ? 'block' : 'none'}"></div>
</div>