错误：[$ injector：nomod]模块“ myApp.view1”不可用

Question

Please help me to organize code correctly. I'm trying to change structure of simple angular-seed project in order to learn how to act with it. As I see I have troubles with structuring modules & sub-modules

File app.js

    angular.module('myApp.view1');
    angular.module('myApp.view2');
angular.module('myApp', [
  'myApp.view1',
  'myApp.view2',
  'ngRoute'
]);
var myApp = angular.module('myApp');
myApp.config(['$routeProvider', function($routeProvider) {
  $routeProvider
    .when('/view1', {
      templateUrl: 'views/view1.html',
      controller: 'View1Ctrl'
    })

  .when('/view2', {
    templateUrl: 'views/view2.html',
    controller: 'View2Ctrl'
  })

  .otherwise({
    redirectTo: '/view1'
  });
}]);

Here's view1.js

    'use strict';

var view1 = angular.module('myApp.view1');
  view1.controller('View1Ctrl', [function($scope) {
    $scope.firstName = "John";
  }]);

And view2.js

'use strict';

var view2 = angular.module('myApp.view2');
view2.controller('View2Ctrl', [function($scope) {
$scope.lastName = "Doe";
}]);

Answer 1

The error is because you are accessing the module and not defining them Define them like -

angular.module('myApp.view1', []);
angular.module('myApp.view2', []);

assuming that the modules have no dependencies.

And do check out my comment on app structure.