Angular JS adding an extra module causes project to not render any pages

Question

Sorry if this is a noob question but I am brand new to Angular JS.

While programming my web app I wanted to add an extra page to my website. Currently I have a main module that contains smaller modules for each webpage:

'use strict';
angular.module('myApp', [
  'ngRoute',
  'myApp.view1',
  'myApp.view2',
  'myApp.version',
  'ui.bootstrap'
]).
config(['$routeProvider', function($routeProvider) {
  $routeProvider.otherwise({redirectTo: '/view1'});
}]);

This works fine but when I try and add an extra module 'myApp.view3' none of the pages render. Here is what the modules look like:

view1

angular.module('myApp.view1', ['ngRoute'])
// configuration
.config(['$routeProvider',
    function ($routeProvider) {
        $routeProvider.when('/view1', {
            templateUrl: 'view1/view1.html',
            controller: 'View1Ctrl'
        });
}])//controller and factory not shown

view 3

angular.module('myApp.view3', ['ngRoute'])

.config(['$routeProvider', function ($routeProvider) {
        $routeProvider.when('/view3', {
            templateUrl: 'view3/view3.html',
            controller: 'View3Ctrl'
        });
}])

.controller('View3Ctrl', ['$scope', function($scope){

}
]);

Answer 1

对不起，我才意识到我忘了在HTML文件中包含JS脚本