How to add multiple modules and controllers in angularjs

| By Webner

If we have multiple modules and controller in single page i.e. :

<div id=”id1” ng-app="App1" ng-controller="productController"> </div>
 <div id=”id2” ng-app="app2" ng-controller="orderController"> </div>

We need to add angular.bootstrap after adding the controllers:

var App1 = angular.module(App1, []);
mySampleApp.controller(productController, function($scope) {});
var App2 = angular.module(App1, []);
mySampleApp.controller(orderController, function($scope) {
angular.bootstrap(document.getElementById("id1 "), [‘App1’]);
angular.bootstrap(document.getElementById("id2 "), [‘App2’]);

Using this we can add multiple controllers and modules on a single page.

Leave a Reply

Your email address will not be published. Required fields are marked *