I'm trying to create sub-modules within my angular app. I would like to have one module for each file I have (services.js, controllers.js, ...). The problem I have is that when I create one for each, the bootstrapping stops working. I have the following:
app.js
angular.module('myApp', [
'appSrv',
'appCtrl'
]);
controllers.js
var appCtrl = angular.module('appCtrl', []);
appCtrl.controller('TodoCtrl', ['$scope', 'listener', 'pouchWrapper', function($scope, listener, pouchWrapper) {
$scope.orderProp = 'text';
...
);
services.js
var appSrv = angular.module('appSrv', []);
appSrv.value('version', '0.1');
appSrv.factory('myPouch', [function() {
...
);
index.jade
doctype html
html(ng-app='myApp')
head
title=title
link(rel='stylesheet' href='stylesheets/style.css')
link(rel='stylesheet' href='bower_components/bootstrap/dist/css/bootstrap.css')
script(type='text/javascript' src='javascripts/angular-1.3.0b7.min.js')
script(type='text/javascript' src='javascripts/pouchdb-2.1.0.min.js')
script(type="application/javascript" src="app/app.js")
script(type="application/javascript" src="app/controllers.js")
script(type="application/javascript" src="app/services.js")
But when I try a simple operation such as 1 + 2 = {{ 1 + 2 }}
in my index, I don't get the expected result.
Am I doing something wrong?
Thanks!