我希望通过在变量名称前使用冒号来在路由中包含参数
// dynamic pages for each ITEM, once selected
// from $routeParams.itemID in ItemCtrl
.when('/:itemID', {
templateUrl: 'views/item.html',
controller: 'ItemController'
})
当单击 div 框时,Angular 应路由到特定项目
<div class="itemBox" ng-click="getItem(item._id)">
现在,对 Node/express API 的调用似乎正在工作
[16:36:18.108] GET http://localhost:8080/api/items/534240001d3066cc11000002 [HTTP/1.1 304 Not Modified 4ms]
但是这个错误记录在控制台中:
Error: Can't set headers after they are sent.
at ServerResponse.OutgoingMessage.setHeader (http.js:691:11)
...
at Promise.<anonymous> (/Users/Username/Downloads/project/v19/app/routes.js:41:8)
...
routes.js 中的第 41 行(41:8?)是 res.json(item);
// load the item model
var Item = require('./models/item');
// get One item
app.get('/api/items/:item_id', function(req, res) {
// use mongoose to get the one item from the database
Item.findById({
_id : req.params.item_id
},
function(err, item) {
// if there is an error retrieving, send the error. nothing after res.send(err) will execute
if (err)
res.send(err)
res.json(item); // return the item in JSON format
});
});
虽然问题可能出在 Controller 中,因为所有其他 API 调用都可以工作。所以我尝试在各处传递 $routeParams!
angular.module('ItemCtrl', [])
// inject the Item service.factory into our controller
.controller('ItemController', function($scope, $routeParams, $http, Items, isEmptyObjectFilter) {
// get an Item after clicking it
$scope.getItem = function(id, $routeParams) {
Items.getOne(id, $routeParams)
// if successful getByID, call our function to get the Item data
.success(function(data, $routeParams) {
// assign our Item
$scope.item = data;
// for use with a parameter in appRoutes.js using itemID as the variable
$scope.itemID = $routeParams.itemID;
})
.error(function(data) {
console.log('Error: ' + data);
});
};
});
或者也许是服务?这是否需要将 $routeParams 作为 function(id, $routeParams) 传递
angular.module('ItemService', [])
// super simple service
// each function returns a promise object
.factory('Items', function($http) {
return {
get : function() {
return $http.get('/api/items');
},
getOne : function(id) {
return $http.get('/api/items/' + id);
},
create : function(itemData) {
return $http.post('/api/items', itemData);
},
delete : function(id) {
return $http.delete('/api/items/' + id);
}
}
});
非常感谢一些调试方面的帮助..谢谢
最佳答案
看起来您正在正确获取数据。问题是你希望在成功获取API调用后改变路由?
$routeParams 不会为您更改路线。那只是获取数据。使用 $location 更改路线。
.controller('ItemController', function($scope, $routeParams, $location, $http, Items, isEmptyObjectFilter) {
$scope.getItem = function(id) {
Items.getOne(id)
.success(function(data) {
$scope.item = data;
$scope.itemID = $routeParams.itemID;
// redirect
$location.path('/' + $routeParams.itemID);
});
});
});
由于您的所有数据似乎都已准备就绪,因此您只需要 Angular 重定向到路线即可。 $location 应该是要走的路。
关于javascript - Angular - $routeParams.itemID 用于加载domain.com/:itemID ALMOST WORKING?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22922682/