ng-click event not getting cleared in Ionic app

466 views Asked by At

I am developing an app using the Ionic framework which also uses AngularJS. I have a problem where an ng-click event is being triggered, but then the same event is triggered on the next button press of a different button. For example on a page, I have multiple buttons, each with different ng-click handlers. However when I click a button, that buttons event handler is called, when I then click a different button, the first button's event handler is called again. I have to click that second button a second time to have its event handler called.

Here is my view code:

<ion-header-bar align-title="center" class="bar-positive">
    <div class="buttons">
      <button class="button button-clear" ng-click="goBack()">Back</button>
    </div>
    <h1 class="title"><img class="title-image" src="img/bkg_header2x.png" width="242" height="32" /></h1>
</ion-header-bar>

<ion-content class="">
    <div class="maker_detail_title">
        {{maker.project_name}}
    </div>
    <div class="maker_detail_maker">
        <span style="font-weight: bold;">Maker:</span> {{maker.maker_name}}
    </div>
    <div class="maker_description">
        {{maker.project_description}}
    </div>
    <div class="maker_detail_social">
        <button type="button" class="button button-clear" ng-click="shareTwitter($event)">Twitter</button>
    </div>
</ion-content>

and the corresponding controller code:

.controller('MakerDetailCtrl', function($scope, $state, $stateParams, $ionicHistory, makerService, $cordovaSocialSharing) {
    $scope.maker = makerService.getMakerById($stateParams.makerId);

  $scope.goBack = function() {
      $ionicHistory.goBack();
  }

  $scope.shareTwitter = function($event) {
    alert('share twitter');
    $event.stopPropagation();
  }
})

In this example, when I click the twitter button, I see the 'share twitter' alert, if I then click the 'back' button I again get the 'share twitter' alert. The second time a click back it calls the back action.

Note that I tried adding the stopPropagation call but that did not help. Any ideas?

0

There are 0 answers