未知提供者:postPromiseProvider< - postPromise< - MainCtrl

时间:2017-01-22 09:18:49

标签: angularjs node.js express mean-stack

我写了我的angularApp

var app = angular.module('flapperNews', ['ui.router']);

app.factory('posts', ['$http',function($http) {
    var posts = [
        { title: 'post 1', upvotes: 5 },
        { title: 'post 2', upvotes: 2 },
        { title: 'post 3', upvotes: 15 },
        { title: 'post 4', upvotes: 9 },
        { title: 'post 5', upvotes: 4 }
    ];
    var service = {};
    service.getAll = function() {
        return $http.get('/posts').success(function(data){
            angular.copy(data, posts);
        });
    };

    service.create = function(post) {
    return $http.post('/posts', post).success(function(data){
        posts.push(data);
        });
    };
    service.getPosts = function() {
        return posts;
    };

    service.upvote = function(post) {
        return $http.put('/posts/' + post._id + '/upvote').success(function(data){
                post.upvotes += 1;
        });
    };

    service.get = function(id) {
        return $http.get('/posts/'+id).then(function(res) {
            return res.data;
        });
    }

    return service;

}]);


app.controller('MainCtrl', ['$scope', 'postPromise',
    function($scope, postPromise) {
        $scope.posts = postPromise;
        $scope.title = null;
        $scope.link = null;
        $scope.test = "Hello World";
        $scope.addPost = function() {
            if (!$scope.title || $scope.title === '') {
                return;
            } else {
                posts.create({
                    title: $scope.title,
                    link: $scope.link,
                });
                $scope.link = '';
                $scope.title = '';
            }
        };

        $scope.incrementUpvotes = function(post) {
            posts.upvote(post);
        };
    }
]);

app.controller('PostsCtrl', [
    '$scope',
    'posts',
    'post',
    function($scope, posts, post) {
        $scope.post = post;
        $scope.addComment = function(){
            if($scope.body === '') { return; }
            $scope.post.comments.push({
                body: $scope.body,
                author: 'user',
                upvotes: 0
            });
            $scope.body = '';
        };
    }
]);



app.config([
    '$stateProvider',
    '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {
        $stateProvider
            .state('home', {
                url: '/home',
                templateUrl: '/home.html',
                controller: 'MainCtrl',
                resolve: {
                    postPromise: ['posts', function(posts){
                        return posts.getAll();
                    }]
                }
            })

        .state('posts', {
            url: '/posts/{id}',
            templateUrl: '/posts.html',
            controller: 'PostsCtrl',
            resolve: {
                post: ['$stateParams', 'posts', function($stateParams, posts) {
                    return posts.get($stateParams.id);
                }]
            }
        });

        $urlRouterProvider.otherwise('home');
    }
]);

当我加载主页时,我收到错误消息

Unknown provider: postPromiseProvider <- postPromise <- MainCtrl

我不明白这一点。 我已经尝试重构代码,将工厂置于控制器之上,但它仍然会抛出相同的错误。

PS - 用于检索帖子的网络调用(我可以在浏览器Netwrok调用中看到它)

1 个答案:

答案 0 :(得分:1)

您的工厂名称为posts而不是postPromise

将您的MainCtrl更改为:

app.controller('MainCtrl', ['$scope', 'posts', function($scope, posts) {
});