防止在angularjs中两次单击按钮

Question

我正在用angularjs工作，并且是新手，因此我使用此工具制作了一个应用程序。

我的应用程序中有几页，现在我的问题是我有两个可以导航到其他页面的按钮，但是我的问题是当我单击一个按钮（跨度）时，它两次打开同一页面。

谁能帮我解决这个问题？ 我的代码如下：

JavaScript的

  $scope.foo = function() {
        if ($scope.filterflg !== "1" ) {
            $scope.filterflg = "1";
             $scope.disabled = true;


            gallery.pushPage("filter.html", {
                params: FkCategory
            });

            $timeout(function() {
                console.log("====timeout occured===");
                $scope.filterflg = "0";
                  $scope.disabled = false;
            }, 3000);
        }
    };

HTML

<ons-button  id="test1" class="toolbar-button--quiet navigation-bar__line-height"  ng-click="isProcessing=true;foo()" ng-model ="filterflg"
         style="border: none; padding: 0 5px 0 0; margin-right:7px ;">
            <i class="ion-android-options" style="font-size:24px; color: #FFFFFF;"></i>
        </ons-button>

我在这个问题上浪费了10天，希望一些朋友能帮助我节省工作。 :(

Answer 1

ng-disabled在跨度上不起作用。 它仅适用于输入或按钮类型。

您有两种选择-

1. 将范围转换为按钮元素

2. 使用$ scope.isProcessing之类的变量包装foo（）函数。

   $ scope.foo = function（）{

    if (!$scope.isProcessing) { //... $timeout(function() { console.log("====timeout occured==="); $scope.filterflg = "0"; $scope.disabled = false; $scope.isProcessing = false; }, 3000); } 

   };

HTML

<span ng-click="isProcessing=true;foo()"></span>

Answer 2

将跨度转换为按钮元素，并在首次单击后立即在不使用$timeout情况下禁用该按钮

 $scope.foo = function() {
        just simply 
        $scope.disabled = false;
        // Your other code 


 };

或使用标记来检查页面是否已打开将解决您的问题

 $scope.isFilteropen = false;

 $scope.foo = function() {
     if ($scope.isFilteropen == false) {
         $scope.isFilteropen = true;
        // your other code 
     }
 };

Answer 3

试试这个

<span class="toolbar-button--quiet navigation-bar__line-height" ng-disabled="disabled" ng-click="disabled=true;foo();disabled=false;" ng-model ="filterflg"> </span>

然后从函数Foo()删除timer 。