Angularjs ng-click called twice

Asked

Viewed 365 times

0

I am using the ng-click to make a common javascript call. But it is being called/fired twice when I click on the call.

My directive:

angular.module('myApp.directives').directive('cadastrarPost', cadastrarPost);

cadastrarPost.$inject = ['$ionicPopup', '$ionicPopover'];

function cadastrarPost($ionicPopup, $ionicPopover) {

    var ddo = {
        templateUrl: 'pages/ingressos/cadastrarPost.html',
        replace: true,
        restrict: "E",
        link: link,
    }


    function link(scope, element, attrs) {
        function salvar() {
            ...
        }
    }

    return ddo;
}

My html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/angular-animate/angular-animate.min.js"></script>
    <script src="lib/angular-sanitize/angular-sanitize.min.js"></script>
    <script src="js/lib/angular-locale_pt-br.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>

    <!-- Aplicação -->
    <script src="js/app.js"></script>

    <!-- Diretivas -->
    <script src="pages/inicio/cadastrarPost.js"></script>

</head>
<body ng-app="MyApp">
    <ion-nav-view>
        <ion-view cache-view="false" can-swipe-back="false">
            <ion-header-bar class="bar-light">
                <span ng-if="!vm.ingresso.id">
                    <button class="button button-clear text-uppercase" ng-click="salvar()">Salvar</button>
                </span>
            </ion-header-bar>
        </ion-view>
    </ion-nav-view>
</body>
</html>
angularjs apache-cordova angularjs-directives
  • 2

    this is not a standard behavior, your code should have some inconsistency, but do the following, pass $Event on ng-click and save add function Event.stopPropagation();

1 answer

0


After much research, including this long discussion of possibilities (Here) I was able to solve the problem as follows:

Switch ng-click to IONIC’s on-tap

From my research, there seems to be a bug in this ion-header-bar. So much so that out of it worked perfectly, moreover, this bug only appeared in versions of Android < 5.x.

It follows as the code. Just the correction in the button line. 

<ion-nav-view>
        <ion-view cache-view="false" can-swipe-back="false">
            <ion-header-bar class="bar-light">
                <span ng-if="!vm.ingresso.id">
                    <button class="button button-clear text-uppercase" on-tap="salvar()">Salvar</button>
                </span>
            </ion-header-bar>
        </ion-view>
    </ion-nav-view>

Browser other questions tagged angularjs apache-cordova angularjs-directives

You are not signed in. Login or sign up in order to post.