Question

尝试用最简单的实现方法，如果用户第二次选择它，则使用ng-click切换按钮，然后如果他们第三次点击则返回。基本上，我现在使用带有4个不同按钮的ng-show进行ng-click，下面显示了一个示例，它可以工作，但我现在的要求是，如果用户再次选择按钮，它将取消下面的div 。没想到将ng-show和ng-hide一起用于此并且无法看到ng-toggle如何工作的好习惯。有什么帮助吗？

示例代码：

<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>

Answer 1

您可以根据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">

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

第二次单击时，角度ng-单击切换

1 个答案: