我在开发MEAN堆栈应用程序时遇到了一些麻烦。 这就是问题所在:
在后端,我有一个从Mongo数据库返回数据的API。如果我从URL调用此api,一切都很好,但是当AngularJS执行此操作时,问题就出现了。
这是我的服务器端路由文件的代码:(注意,这不是完整的代码,只是不工作的代码块)
var users = require('../../app/controllers/users.server.controller'),
articles = require('../../app/controllers/articles.server.controller');
module.exports = function(app) {
app.route('/api/:userId/articles/')
.get(articles.listArticulosUsuario)
.post(users.requiresLogin, articles.create);
app.param('articleId', articles.articlesByUser);
}
这是服务器端控制器中的功能:
exports.listArticulosUsuario = function(req, res) {
// Usar el método model 'find' para obtener una lista de artículos
Article.find({creador:{_id: req.params.userId}}).sort('-creado')
.populate('creador', 'firstName lastName fullName username').exec(function(err, articles) {
if (err) {
// Si un error ocurre enviar un mensaje de error
return res.status(400).send({
message: getErrorMessage(err)
});
} else {
// Enviar una representación JSON del artículo
res.jsonp(articles);
}
});
};
exports.articlesByUser = function(req, res, next, id) {
// Usar el método model 'findById' para encontrar un único artículo
Article.find({creador:{_id: req.params.userId}}).populate('creador', 'firstName lastName fullName').exec(function(err, articles) {
if (err) return next(err);
if (!articles) return next(new Error('Fallo al cargar el artículo ' + id));
// Si un artículo es encontrado usar el objeto 'request' para pasarlo al siguietne middleware
req.articles = articles;
//console.log('hola')
// Llamar al siguiente middleware
next();
});
};
如果我直接从URL发出请求,例如传递http://localhost:3000/api/5679df50c735551804206812/articles会返回:
[{
"_id":"5679df6ec735551804206813",
"creador":{
"_id":"5679df50c735551804206812",
"firstName":"Guest",
"lastName":"1",
"username":"guest1",
"fullName":"Guest 1",
"id":"5679df50c735551804206812"},
"__v":0,
"contenido":"efsdafasfasd",
"titulo":"ese",
"creado":"2015-12-22T23:40:30.793Z"
}]
但问题是当我尝试将资源实现到AngularJS时,这里是客户端代码块:
这是配置文件。
文件:users-articles.client.config.js(配置文件)
//invocar modo javascript 'strict'
'use strict'
//configurar el modulo routes de 'articles'
angular.module('usersArticles').config(['$routeProvider',
function($routeProvider){
$routeProvider.
when('/:userId/articles' ,{
templateUrl: 'users-articles/views/user-articles.client.view.html'
});
}
]);
这是控制器文件
文件:users-articles.client.controller.js
//invocar modo javascript 'strict'
'use strict';
//crear el controller 'articles'
angular.module('usersArticles').controller('UsersArticlesController', ['$scope', '$routeParams', '$location', 'UserArticles',
function($scope,$routeParams,$location,UserArticles) {
//Exponer el service Authentication
//crear un nuevo metodo controller para recuperar una lista de articulos por usuario
$scope.findByUser = function(){
//usar el metodo 'query' de article para enviar una peticion GET apropiada
$scope.articless = UserArticles.query();
}
}
]);
这是服务文件
file:users-articles.client.services.js
//Invocar modo javascript strict
'use strict';
//crear el service 'articles'
angular.module('usersArticles').factory('UserArticles', ['$resource' ,
function($resource) {
//usar el service '$resource' para devolver un objeto '$resource' article
return $resource('/api/:userId/articles', {}, {
query: { method: 'GET', params: {userId: '@creador._id'}, isArray: true }
})
}]);
这是视图文件
file:users-articles.client.view.html
<!-- La view listar articulos -->
<section data-ng-controller="UsersArticlesController" data-ng-init="findByUser()">
<h1>Articulos del user</h1>
<h5><a data-ng-href="#!/articles" >Volver a todos los artículos</a></h5>
<ul>
<!--La lista de articulos -->
<li data-ng-repeat="article in articless">
<h3>
<a data-ng-href="#!/articles/{{article._id}}" data-ng-bind="article.titulo"></a>
</h3>
<br>
<small data-ng-bind="article.creado | date: 'medium'"></small>
<small>/</small>
<small>
<a data-ng-href="#!/users/{{article.creador._id}}/articles" data-ng-bind="article.creador.fullName"></a>
</small>
<p data-ng-bind="article.contenido"></p>
</li>
</ul>
<!-- Si no hay articulos en la lista, sugerimos al usuario que cree un nuevo articulo -->
<div data-ng-hide="!articless || articless.length">
Aún no hay articulos, ¿Por qué no <a href="/#!/articles/create">creas uno</a>?
</div>
</section>
因此,所涉及的所有代码,我现在都会显示错误的行为。 当资源调用&#34; / api /:userId / articles&#34; 时,它会调用&#39; / api / articles&#39; 并且:userId似乎不存在..
如果我拨打&#39; / api / Hello:userId / articles&#39; ,它会尝试拨打 / api / Hello / articles < / p>
所以看起来冒号(:)之后的单词会神奇地消失
你带给我的任何帮助都很好,谢谢你,对不起我的英语不好。