Angular js not finding controller?

Question

I am using angular js, I have written code in two different jsp files.showing two different views. if I render single view it works fine.but if I render both views on same page I got this error

Error: Argument 'UserCtrl' is not a function, got undefined

the js code snippet in jsp's is as follows.

in my first jsp file is

// Bootstrap the Application
var App = angular.module('module', []);
// Set up a controller and define a model
App.controller('UserCtrl', function($scope) {
    $scope.user = {};
    jQuery.get("<c:url value='${someUrl}'/>",
            function(data) {
            angular.element('#user_detail').scope().user = data;
            angular.element('#user_detail').scope().$apply();
}, "json");
});

and in the second one is

// Bootstrap the Application
var App = angular.module('module', []);

// Set up a controller and define a model
App.controller('ProfileCtrl', function($scope) {
    $scope.profile = {};
    jQuery.get("<c:url value='${someUrl}'/>",
            function(data) {
            angular.element('#profile').scope().profile = data;
            angular.element('#profile').scope().$apply();
}, "json");
});

I tried giving distinct names to modules but that too did not worked for me.any help is appreciated. thanks !

Answer 1

got it worked. It was due to the ng-app variable, i have binded it on both jsp pages.So now i binded it to the main body wrapper for both the jsp's.

Answer 2

I think you are reintializing the app variable pls try below code

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

working fiddle is http://jsfiddle.net/e6A5q/