As written before in the threads, you don't need two apps in the same page.
both modules can be part of the same app - Actually that's the best way to
do this - a module (or module) for directives, module (or modules) for
controllers, filters, etc
you need to include all the js file in index.html and and declare *one *app.
you also need to declare all the modules part of the app
something like app.js (or any other name)
with:
var app = angular.module('myApp',['directiveModule', 'filterModule',
'ngRoute',etc..]) notice that in the array we declare strings with all the
modules to be included by the app including our vendor modules (Restangular
for example), extra angular modules that are outside angular
core(ngResource, ngSanitize, ngCookies, ngRoute etc) and *our* modules (we
actually can attach everything to one module, but seperation makes some
logical sense, and there are rumors that in the future angular would
support lazy loading of modules) such as the filterModule or directiveModule
Then you also won't need all the "bootstraping" boilerplate, which is
really to be used behind the scenes by angular, and should be used by
wepapps only in very specific and special cases.
Good luck!
On Thursday, December 26, 2013 8:01:01 PM UTC+2, steve98177 wrote:
>
> I had two test files, each containing a single module.
>
> main.1.js has some controllers.
> main.2.js has some directives.
>
> I wanted to be able to use both modules in the same index.html
>
> This finally worked for me after I put a bootstrap statement
> for each module in the file defining it.
>
> index.html
> <html>
> <head>
> <script type="text/javascript" src="js/vendor/angular.js"></script>
> </head>
> <body>
>
> <!-- 1. Filters -->
> <div id="app1" ng-controller="filterCtrl">
> ...
> </div>
>
> <!-- 2. Directives -->
> <div id="app2">
> <anewdirective></anewdirective>
> ...
> </div>
> <script type="text/javascript" src="js/main.9.js"></script>
> <script type="text/javascript" src="js/main.10.js"></script>
> </body>
> </html>
>
> main.1.js
> var app = angular.module('filterApp', []);
> ...
> angular.bootstrap(document.getElementById("app1"), ["filterApp"]);
>
>
> main.2.js
> var app = angular.module('directiveApp', []);
> ...
> angular.bootstrap(document.getElementById("app2"), ["directiveApp"]);
>
>
>
>
> On Wednesday, December 26, 2012 11:14:26 AM UTC-8, Andy Joslin wrote:
>>
>> Hi sunith, it's simple:
>>
>> HTML:
>> <div id="app1" ng-controller="app1control">
>> <div id="app2" ng-controller="app2control">
>>
>> JS:
>> angular.module("firstApp", []).controller("app1control", function()
>> {...});
>> angular.module("secondApp", []).controller("app2control", function()
>> {...});
>>
>> angular.bootstrap(document.getElementById("app1"), ["firstApp"]);
>> angular.bootstrap(document.getElementById("app2"), ["secondApp"]);
>>
>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
