

すみません、以下のサンプルを使ってアプリを作成しているのですが、ボタンを連打すると何回も連打したボタンのページを開きに行ってしまいます。  
次のページに遷移するまでアクションを受け付けないようにするにはどうすれば良かったでしょうか？


CC BY-SA 3.0
2015-05-21T03:49:45.887
10448
2015-05-21T09:32:09.817
7724
question
monaca
クリック　したら次の画面が表示されるまでアクションを受け付けないようにしたい


押したら画面遷移が完了するまで非活性にする方法等が一般的かなと思います。  
このままだと使えないと思いますが、参考程度に。

[code]

    ons.bootstrap()
    .controller('main', function($scope) {
      $scope.disable = false;
      $scope.push = function(page) {
        $scope.disable = true;
        setTimeout(function(p) {
          myNavigator.pushPage(p);
        }, 1500, page);
      }
      $scope.postPush = function() {
        $scope.disable = false;
      }
    });
[/code]

[code]

    <head>
      <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/js/angular/angular.min.js"></script>
      <script src="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/js/onsenui.min.js"></script>
      <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/css/onsenui.css" rel="stylesheet"/>
      <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.0-beta/build/css/onsen-css-components.css" rel="stylesheet"/>
    </head>
    
    <body ng-controller="main">
        <ons-navigator var="myNavigator" page="page1.html" ons-postpush="postPush()">
        </ons-navigator> 
    </body>
    
    <ons-template id="page1.html">
      <ons-page>
        <ons-toolbar>
          <div class="center">Navigator</div>
        </ons-toolbar>
    
        <div style="text-align: center">
          <br>
          <ons-button ng-click="push('page2.html')" ng-disabled="disable">
            Push Page 2
          </ons-button>
        </div>
      </ons-page>
    </ons-template>
    
    <ons-template id="page2.html">
      <ons-page>
        <ons-toolbar>
          <div class="left"><ons-back-button>Back</ons-back-button></div>
          <div class="center">Page 2</div>
        </ons-toolbar>
    
        <div style="text-align: center">
          <h1>Page 2</h1>
          <ons-button onclick="myNavigator.popPage()">
            Pop Page
          </ons-button>
        </div>
      </ons-page>
    </ons-template>
    
                  
[/code]


CC BY-SA 3.0
2015-05-21T09:32:09.817
10461
2015-05-21T09:32:09.817
3516
10448
answer