如何在离子应用程序中查找按钮是否处于活动状态

Question

在我的离子应用程序中，我有一个有2个按钮的屏幕。按下每个按钮时，我调用一个函数来执行一些密集的网络任务。一切正常。

通常，当我按下其中一个按钮时，它会调用该函数。但是如果我再次按下该按钮，它会再次调用该函数并执行相同的工作。如果我之前按下过，我不希望它再次调用函数。只有当我按下另一个按钮然后再次按下这个按钮时，它才应该调用该函数。

那么，我可以在调用函数之前了解按钮的活动状态吗？

我是Ionic的新手，所以希望得到任何帮助。

按钮代码 ：

<div class="button-bar button-bar-full bar-light"
             ng-if="activityLog.enabledChecked && !activityLog.disabledToggle">
            <a class="button" ng-class="{'button-active': activityLog.isUnblockedFiltered}"
               ng-click="switchFilter(true)">{{ 'main.activity-log-blocked-report' | i18n }}</a>
            <a class="button" ng-class="{'button-active': !activityLog.isUnblockedFiltered}"
               ng-click="switchFilter(false)">{{ 'main.activity-log-full-report' | i18n }}</a>
        </div>

PS：我可以应用一些标志并且可以完成这项工作，但想知道我是否可以通过某些 API 了解按钮的状态。

谢谢

Answer 1

您可以使用

以下方法检查按钮是否已禁用

var target = angular.element(document.getElementById("#buttonId"));
if (target.prop('disabled')) {
    // Button is disabled
    //Do something
}

Answer 2

在您的视图中，将 ng-disabled 绑定到控制器"disableButton"中的属性，如下所示，并在单击按钮时使其为真。然后，该按钮将在执行 api 调用时被禁用，完成后您可以将其设置为 false 以再次启用该按钮。

<a class="button" ng-disabled="disableButton" ng-class="{'button-active': activityLog.isUnblockedFiltered}"
           ng-click="switchFilter(true)">{{ 'main.activity-log-blocked-report' | i18n }}</a>