Wednesday, December 9, 2015

declaring multiple modules in same js file

module1.js
var app1 = angular.module('app1', []);

    app1.controller('Ctrl1', function ($scope)
    {
      $scope.name = "abishkar";
    });

    var app2 = angular.module('app2', []);

    app2.controller('Ctrl2', function ($scope)
    {
      $scope.name = "bhattarai";
    });

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

module1.html

<script src="http://code.angularjs.org/1.2.9/angular.min.js" type="text/javascript"></script>
<script src="js/module1.js" type="text/javascript"></script>

<body>
  <div ng-app="app1">
    <div ng-controller="Ctrl1">
      <span>{{name}}</span>
    </div>
  </div>
  <div id="app2">
    <div ng-controller="Ctrl2">
      <span>{{name}}</span>
    </div>
  </div>
</body>

No comments:

Post a Comment