Double calling controller in Angular JS?

Question

I have controller with method that does AJAX request:

.controller('EditProfileController', ['$scope', '$http') {
   // Do AJAX query here

   // Some methods for update profile
}]);

Also I have $routeProvider in this Angular JS file:

.config(function ($routeProvider) {
    $routeProvider
        .when('/profile/personal/:type', {
            templateUrl: '/personal.html',
            controller: 'EditProfileController'
    })
}

Problem is that when I open page with URL /profile/personal/:type it calls again controller EditProfileController and calls AJAX method inside.

How I can fix it?

HTML code:

<div ng-controller="EditProfileController">
   <!-- Here are loaded data from AJAX response
</div>

Solution: Problem was in double ng-view in template:

<div ng-show="isLoaded" ng-view></div>
<div ng-show="!AILoading" ng-view></div>

juco · Accepted Answer · 2015-05-13 16:54:15Z

7

Simply remove the ng-controller directive from the HTML as the router is already taking care of this

edited May 13, 2015 at 16:54

answered May 13, 2015 at 15:40

juco

6,3423 gold badges27 silver badges42 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Okazari Over a year ago

Nice catch, didn't spot the mistake. To add some informations, i really feel that in a clean AngularJS application you should never use the ng-controller directive. All your controllers will be bind by the routing system.

Hamed Over a year ago

If I have understood correctly, I need to remove name of controller from routing? If yes, how routeProvider will recognize about controller?

juco Over a year ago

No, the ng-controller in the HTML can go. Sorry, I should have been clearer - answer updated

Collectives™ on Stack Overflow

Double calling controller in Angular JS?

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related