Currently, I am incorporating AngularJS into a Backbone.js application. The scenario is as follows: I have one controller (let's call it controller1) which is added to the Angular app from a Backbone view (referred to as view1). Subsequently, I introduced another controller (named controller2) in a different Backbone view (referred to as view2). I added controller2 to the Angular app from view2, but surprisingly the constructor of controller2 does not get called.
view1
bootstarpAngular: function(){
var app = angular.module('APP', []);
app.controller('Controller1', ['$scope', loadController1]);
angular.element(document).ready(function() {
this.angular = angular.bootstrap(document, ['APP']);
});
}
controller1
function loadController1($scope){
console.log("Controller1");
}
view2
addController2: function(){
var app = angular.module('APP');
app.controller('Controller2', ['$scope', loadController2]);
}
controller2
function loadController2($scope){
console.log("Controller2");
}
At present, only the console log for controller1 is displayed, not for controller2.
I desire both controllers to be invoked. Could there be an error in my approach, or is there perhaps a better way to achieve this requirement?