How to execute multiple data-ng-app in sequence in angularjs

I have two ng-app in my application app1 and app2 and two firstcontroller and secondcontroller respectively.

The problem is that the second controller is executed first, and then the first controller.

But I want to execute sequentially as the 1st controller, then the 2nd controller.

please provide a solution for this.
thanks in advance.

 var app1 = angular.module('firstapp', []); app1.controller("firstcontroller",function($scope){ $scope.arr1={name:'arjun'}; alert($scope.arr1.name); }); var app2 = angular.module('secondapp', []); app2.controller("secondcontroller",function($scope){ console.log("come to second app"); $scope.arr2={title:'kumar'}; alert($scope.arr2.title); }); angular.bootstrap(document.getElementById("app2"),['secondapp']); 
 <body > <div id="app1" data-ng-app="firstapp" data-ng-controller="firstcontroller"> <p>{{arr1.name}}</p> </div> <div id="app2" data-ng-app="secondapp" data-ng-controller="secondcontroller"> <p>{{arr2.title}}</p> </div> </body> 
+5
source share
1 answer

Doc said

To run multiple applications in an HTML document, you must manually download them using angular.bootstrap

Although it is possible to have several ng applications on a page, only one ng-app directive will be automatically created and initialized by the Angular infrastructure.

Now the order can be ordered using

 angular.element(document).ready(function() { angular.bootstrap(document.getElementById("app2"),['secondapp']); }); 

Here is the plunker for you Plunker

+2
source

Source: https://habr.com/ru/post/1216165/


All Articles