Controller getting invoked twice

partha...@gmail.com

unread,

Sep 12, 2012, 6:37:17 PM9/12/12

to ang...@googlegroups.com

Hi,

I'm using AngularJS for my project and I'm loving it.

However, I have observed that all the controllers are getting invoked twice.

So, in the sample provided below I'm getting the 'testing' alert twice.

Is there something I'm doing wrong?

Here is how my setup looks.

Main View:

<!DOCTYPE html>

<head>

<title>Merlin SPA</title>

</head>

<body>

</body>

</html>

Info.html:

</div>

Module:

angular.module('myApp', []).config(['$routeProvider', function ($routeProvider) {

$routeProvider.

when('/', { templateUrl: 'partials/Info.html', controller: 'MyController' });

}]);

Controller:

function MyController($scope) {

alert('testing');

$scope.name = 'example';

};

MyController.$inject = ['$scope'];

Thanks in advance.

Partha

Symblify

unread,

Sep 12, 2012, 7:25:43 PM9/12/12

to ang...@googlegroups.com

You are using the controller twice, once in your route definition and once in your HTML partial (info.html), so it being created twice. Try removing one of them, I suggest the one in the partial.

Josh Kurz

unread,

Sep 12, 2012, 8:02:01 PM9/12/12

to ang...@googlegroups.com

Well you don't need to inject the scope. Maybe that's the problem. maybe not though. Try to make a fiddle example of the problem If not.

...from my iphone3G

Josh Kurz

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en.

Josh Kurz

unread,

Sep 12, 2012, 8:03:12 PM9/12/12

to ang...@googlegroups.com

Oh just saw your reply simblify. You are right.

Josh Kurz

--

partha sarathi

unread,

Sep 12, 2012, 9:05:49 PM9/12/12

to ang...@googlegroups.com

Thanks a lot Symblify, that was the reason.

Nathan Nobbe

unread,

Apr 17, 2013, 3:22:14 AM4/17/13

to ang...@googlegroups.com

I had this same issue, and thanks for the answer BTW.

However, I'll happily blame the tutorial which makes the same mistake:

Tutorial Step 2

app/index.html:

<html ng-app>
<head>
...
<script src="lib/angular/angular.js"></script>
<script src="js/controllers.js"></script>
</head>
<body ng-controller="PhoneListCtrl">
<ul>
<li ng-repeat="phone in phones">
{{phone.name}}
<p>{{phone.snippet}}</p>
</li>
</ul>
</body>
</html>

Tutorial Step 7

app/js/app.js:

angular.module('phonecat', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}).
when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
otherwise({redirectTo: '/phones'});
}]);

Seems like they should omit the controller: PhoneListCtrl in the /phones route definition there, yes? And possibly offer an explanation as to why. I'd not realized the ng-controller directive caused instantiation; my impression was it just introduced a mapping to an already instantiated controller.., but I'm still learning ;)

Now reviewing the ngController API docs though, it's clearly specified

"Note that an alternative way to define controllers is via the $route service."

-nathan

Md Imranur Rahman

unread,

Jun 25, 2013, 10:24:46 AM6/25/13

to ang...@googlegroups.com

By the way main issue is . if you declare the controller in the $routeProvider then you dont need to add in the HTML as "ng-controller='youController'" . These is invoke again the controller .

Larry Clapp

unread,

Jun 27, 2013, 1:21:32 PM6/27/13

to ang...@googlegroups.com

> However, I'll happily blame the tutorial which makes the same mistake:

Actually, it doesn't. Step 7 changes the <body> tag. See https://github.com/angular/angular-phonecat/compare/step-6...step-7 for the diff from 6->7.

> Seems like they should omit the controller: PhoneListCtrl in the /phones route definition there, yes?

I think it depends. The route might want to define the controller, which would allow several routes, with different controllers, to use the same fragment. Or, a fragment might want to "hardcode" a controller.