Angular Js Controller called twice some times,

Question

User901332479 posted

Hi Experts,

The following is my code

<div id="resetPasswordPanel"  class="panel static no-border no-shadow">
<div class="header">
<div class="title">
Reset Password
<span data-ng-show="loading"><img src="https://clarinet.athenahealth.com/cdn/14.12.0/Images/Icons/progress-spinner-snake.gif" /></span>
</div>
</div>
<div class="input-area" ng-show="message.length > 0"> {{message}} </div>
<div class="input-area" ng-hide="hideResetPasswordPanel">
<label>Username:</label>
<input class="basic" type="text" autocomplete="off" data-ng-model="username" data-ng-keypress="enterKeyAction($event, resetPassword)">
</div>
<footer ng-hide="hideResetPasswordPanel">
<button class="apply command large right-align" data-ng-click="resetPassword()">Reset Password</button>
</footer>
</div>

I could see my controller function called twice.

This happens some times, Other times it works fine.

Please help on this

Answer 1

User-606451722 posted

It could be because of declaration of the controller twice.

1. In routing from where you would have given templateurl and controller 

2. In your html page in div as data-ng-controller

Solution could be removing it from one of the place probably from html page.

Thanks

Piyush

Answer 2

User901332479 posted

Hi 

Thanks for the reply, But i dont have it twice, you could see that i dont have ng-controller in my code.

I have only in the routing . 

Answer 3

User-606451722 posted

please share how you are routing to this page 

and also the angular version check it if with 1.1.5

Answer 4

User901332479 posted

Hi,

My angular version was 1.2.26

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>

This how I will route

app.config(['$httpProvider', '$stateProvider', '$urlRouterProvider', 'AppConstants', function ($httpProvider, $stateProvider, $urlRouterProvider, AppConstants) {
$urlRouterProvider.otherwise('/');

if (!$httpProvider.defaults.headers.get) {
$httpProvider.defaults.headers.get = {};
}
$httpProvider.defaults.headers.get['If-Modified-Since'] = 'Mon, 26 Jul 1997 05:00:00 GMT';
$httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache';
$httpProvider.defaults.headers.get['Pragma'] = 'no-cache';

$stateProvider
.state('ResetPassword', {
url: '/',
templateUrl: AppConstants.ApplicationRoot + '/Partials/ResetPassword.html',

controller:'resetPasswordController'

})

}]);

Answer 5

User-372054322 posted

I think "data-ng-keypress="enterKeyAction($event, resetPassword)" is the cause. You can try "ng-change" instead of data-ng-keypress.