Controller constructor called more than once

Question

I have a simple controller

angular.module('datahubApp')
  .controller('LoginController',[ '$scope' , '$resource', LoginController]);

function LoginController($scope,$resource){
    console.log('Constructor called');
}

I have used the this in HTML in 2 places for two different components, in the same view

<div ng-controller="Logincontroller as ln"> </div>

<div ng-controller="Logincontroller as ln"> </div>

Now when I run the app, i see this in console

Constructor Called
Constructor Called
Constructor Called

Question 1:

So, this is getting called thrice. Is this normal.

Question 2: In that case, how can I pass the scope variable between components?

Answer 1

Why are you using same controller two times in a view. Use it one time only and it would work perfect.

You can use like:

<div ng-controller="Logincontroller as ln">

   <div></div> <!-- Your first div -->

   <div> </div> <!-- Your second div -->

</div>

AngularJS will call a controller every time it found in a view. No matter how much time is there in view part.