簡體   English   中英

防止在angularjs中兩次單擊按鈕

[英]Prevent a button from being clicked twice in angularjs

我正在用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天,希望一些朋友能幫助我節省工作。 :(

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>

將跨度轉換為按鈕元素,並在首次單擊后立即在不使用$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 
     }
 };

試試這個

<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

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM