title: angular.bootstrap not working
body: <p>I am trying to use multiple modules within a page in angular</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;HTML &gt;
  &lt;HEAD&gt;
  &lt;TITLE&gt;
  ANGULAR
  &lt;/TITLE&gt;
  &lt;link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css" /&gt;
  &lt;/HEAD&gt;
  &lt;BODY&gt;
      &lt;script src="js/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="js/ngModule.js"&gt;&lt;/script&gt;
      &lt;script src="js/App.js"&gt;&lt;/script&gt;
       &lt;div ng-app="AssociateDetails"&gt;
              &lt;div ng-controller="AssociateController as associateData"&gt;
                      &lt;div ng-repeat="associate in associateData.details"&gt;
                           &lt;h1&gt;{{associate.Name}}&lt;/h1&gt;
                           &lt;h2&gt;{{associate.Id}}&lt;/h2&gt;
                      &lt;/div&gt;
             &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="SalaryDiv" ng-app="SalaryDetails"&gt;
      &lt;div ng-controller="SalaryController as sal"&gt;
         &lt;div ng-repeat="salaryDetail in sal.data"&gt;
             &lt;p&gt;{{salaryDetail.Name}}&lt;/p&gt;
             &lt;p&gt;{{salaryDetail.Salary}}&lt;/p&gt;
  
         &lt;/div&gt;
  
      &lt;/div&gt;
      &lt;/div&gt;
  &lt;/BODY&gt;
  &lt;/HTML&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>(function () {
      var app = angular.module("AssociateDetails", []);
      var associatesDetails = [
          { Name: "sdfsd", Id: 123, Alloted: true },
          { Name: "dgfdf", Id: 345, Alloted: true },
          { Name: "sdf", Id: 564, Alloted: true }
      ];
      app.controller("AssociateController", function () {
          this.details = associatesDetails;
      });
  
      var salary = angular.module("SalaryDetails", []);
      var salaryDetails = [
          { Name: "ssss", Salary: 30000 },
          { Name: "asvs", Salary: 90000 },
          { Name: "sdfd", Salary: 87000 }
      ];
      salary.controller("SalaryController", function () {
          this.data = salaryDetails;
      });
      angular.bootstrap(document.getElementById("SalaryDiv"), ['SalaryController']);
  }());
  </code></pre>
  
  <p>First one is working and data is being displayed but the div with id <code>SalaryDiv</code> is not working</p>