当点击第二次时，角的ng-点击切换。

Trying to figure simplest implementation for having a button using ng-click to toggle if a user selects it a second time and then back if they click a third time. Basically, what I have now is using a ng-click with a ng-show with 4 different buttons, An example is shown below and it works, but my requirement now is that if the user selects the button again, it unshows the div below. Didn't think it was good practice using ng-show and ng-hide together for this and cannot see how ng-toggle would work. Any help please?

尝试找到最简单的实现，如果用户第二次选择按钮，就使用ng-click切换按钮;如果用户第三次单击按钮，就返回按钮。基本上，我现在使用的是带有4个不同按钮的ng-show的ng-click，下面显示了一个示例，它可以工作，但是我现在的要求是，如果用户再次选择按钮，它将不显示下面的div。我不认为把ng-show和ng-hide结合在一起是很好的练习，也不知道ng-toggle是怎么工作的。任何帮助吗?

The sample code:

示例代码:

<div id="alerts">
    <div class="alertBtns">
        <input type="button" class="naviaBtn naviaBlue" ng-click="alertShow =2" value="outstanding swipes">
        <input type="button" class="naviaBtn naviaBlue" ng-click="alertShow =3" value="recent denials">
        <input type="button" class="naviaBtn naviaBlue" ng-click="alertShow =4" value="upcoming dates">
        <input type="button" class="naviaBtn naviaBlue" ng-click="alertShow =5" value="account alerts">
    </div>
    <div class="alertGrids">
        <div ng-show="alertShow==1"></div>
        <div ng-show="alertShow==2">
        </div>
        <div ng-show="alertShow==3" class="alertDenials">
        </div>
        <div ng-show="alertShow==4" class="alertDates">
        </div>
        <div ng-show="alertShow==5" class="alertAccounts">
        </div>
    </div>
</div>

1 个解决方案

#1

You can set the value according to the current value of alertShow. Example:

您可以根据alertShow的当前值设置值。例子:

<input type="button" class="naviaBtn naviaBlue" ng-click="alertShow = (alertShow == 2 ? -1 : 2)" value="outstanding swipes">
<input type="button" class="naviaBtn naviaBlue" ng-click="alertShow = (alertShow == 3 ? -1 : 3)" value="recent denials">
<input type="button" class="naviaBtn naviaBlue" ng-click="alertShow = (alertShow == 4 ? -1 : 4)" value="upcoming dates">
<input type="button" class="naviaBtn naviaBlue" ng-click="alertShow = (alertShow == 5 ? -1 : 5)" value="account alerts">

If you try to click on the same button again, the value of alertShow become -1.

如果您尝试再次单击相同的按钮，alertShow的值将变为-1。

1 个解决方案

#1

更多相关文章

随机推荐