我正在浏览Thinkster.io MEAN Stack教程,并对我的实现无效的原因提出疑问。我知道这不是究竟被问到的,但是想知道你将如何做到这一点。我想用工厂来显示我从控制器搬进工厂的帖子。 app.js的代码如下所示。
`
var app = angular.module('flapperNews', []);
app.factory('posts', [function(){
var o = {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}];
};
return o;
}]);
app.controller('MainCtrl', ['$scope', 'posts',function($scope, posts){
$scope.test = 'Hello world!';
$scope.posts = posts.posts;
$scope.addPost = function(){
if(!$scope.title || $scope.title === ''){
return;
}
$scope.posts.push({title: $scope.title, link: $scope.link, upvotes: 0});
$scope.title = '';
$scope.link = '';
};
$scope.incrementUpvotes = function(post){
post.upvotes += 1;
};
}]);
`
最初,工厂中帖子的对象是作为$ scope.posts在控制器中。现在它在工厂(被引用为posts.posts)并且不显示。如何在html中显示数组,因为我在主控制器div下有{{post.title}},其中ng-repeat在引入工厂之前有效。
答案 0 :(得分:2)
您的JSON数据格式不正确。数组posts
后面的JSON数据中有一个分号。
使用它,它应该工作:
var o = {
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
}]
};