Angular JS,错误:[$ injector:nomod]模块'blogger.posts.controllers'不可用

时间:2015-08-17 12:27:09

标签: javascript angularjs angular-ui-router

我正在关注Book Angular.js - Ninja的新手

这就是我设置项目的方式: 应用/ JS / app.js:

angular.module('blogger', ['blogger.posts', 'ui.router']);

应用/模块/帖/ postModule.js:

angular.module('blogger.posts', ['blogger.posts.controllers', 'blogger.posts.services']);

angular.module('blogger.posts').config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider){
    $urlRouterProvider.otherwise('/posts');
    $stateProvider.state('allPosts', {
        url:'/posts',
        templateUrl:'modules/posts/views/posts.html',
        controller:'PostsController'
    });
}]);

应用/模块/帖/ JS / controllers.js:

angular.module('blogger.posts.controllers')
    .controller('PostController', ['$scope', 'postService', function($scope, postService){
        $scope.getAllPosts=function(){
            return postService.getAll();
        };
        $scope.posts=$scope.getAllPosts();
    }]);

应用/模块/帖/ JS / services.js:

angular.module('blogger.posts.services').factory('postService', 
    function(){
        return {
            posts:[{
                id:1,
                title:'Sample title 1',
                content:'Sample content 1',
                permalink:'sample-title1',
                author:'Sandy',
                datePublished:'2015-21-01'
            }],
            getAll:function(){
                return this.posts;
            }
       }
  });

但是,如果我运行代码,它会给我这个错误:

错误:[$ injector:nomod]模块'blogger.posts.controllers'不可用!您要么错误拼写了模块名称,要么忘记加载它。如果注册模块,请确保将依赖项指定为第二个参数

2 个答案:

答案 0 :(得分:0)

/**
 * Create blogger.posts which dependes on sub modules 
 * 'blogger.posts.controllers', 'blogger.posts.services'
 * Ex . angular.module('moduleName', []) syntax for module setter.
 *  This is requried before registering on module
 */
angular.module('blogger.posts', ['blogger.posts.controllers',
 'blogger.posts.services']);

/**
 * Module setters
 */
angular.module('blogger.posts.controllers', []);
angular.module('blogger.posts.services', []);

/**
 * Now you can register controllers , service, directive etc 
 */
angular.module('blogger.posts.services').factory('postService',
    function () {
        return {
            posts: [{
                id: 1,
                title: 'Sample title 1',
                content: 'Sample content 1',
                permalink: 'sample-title1',
                author: 'Sandy',
                datePublished: '2015-21-01'
            }],
            getAll: function () {
                return this.posts;
            }
        }
    });


angular.module('blogger.posts.controllers')
    .controller('PostController', ['$scope', 'postService', 
       function ($scope, postService) {
        $scope.getAllPosts = function () {
            return postService.getAll();
        };
        $scope.posts = $scope.getAllPosts();
    }]);

答案 1 :(得分:0)

我刚刚解决了这个问题(我在做同样的教程:P)。在文件app / js / app.js中,您需要具备以下条件:

angular.module('blogger', [
   'ui.router',
   'blogger',
   'blogger.posts'
]).run(['$state', function($state){
   $state.go('allPosts');
}]);

那应该解决它:)