使用ng-if/ng-show/ng-switch的角度条件显示简要显示了两个元素 [英] Angular conditional display using ng-if/ng-show/ng-switch briefly shows both elements

问题描述

我想基于布尔值显示元素A或B，但是当值切换时，使用ng-if会短暂显示两个元素:

I want to show either element A or B based on the value of a boolean, but when the value switches, both elements are shown briefly, using ng-if:

<div ng-if="a"></div>
<div ng-if="!a"></div>

当我使用ng-show/ng-hide时也会发生这种情况:

This also happens when I use ng-show/ng-hide:

<div ng-show="a"></div>
<div ng-hide="a"></div>

甚至ng-switch

And even ng-switch:

<div ng-switch="a || 'false'">
   <div ng-switch-default></div>
   <div ng-switch-when="false"></div>
</div>

是否有办法仅强制同时显示其中一个元素，或者这根本不可能?

Is there any way to enforce only one of those elements being shown at the same time, or it this just not possible?

推荐答案

更改为

<div ng-show="a == true">A</div>
<div ng-show="a == false">B</div>


<div ng-switch="a || 'false'">
   <div ng-switch-default>A</div>
   <div ng-switch-when="false">B</div>
</div>

<button ng-click="a = !a">Switch {{a}}</button>

选中此小提琴

这篇关于使用ng-if/ng-show/ng-switch的角度条件显示简要显示了两个元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！