我有一个非常简单的MEAN堆栈应用程序。我差不多完成它但是我有一个小虫子。
当我去删除一行时,它会删除它。但是,当我尝试删除第二个或第三个等时,它只会从范围中删除它。我必须首先刷新删除才能再次在服务器端工作。
下面的角度代码
$scope.deleteNote = function(city){
$http({
method: 'DELETE',
url: '/city',
data: city.city,
headers:{"Content-Type": "application/json;charset=utf-8"} });
var index = $scope.cities.indexOf(city.city);
var cityindex = city.city;
console.log(cityindex + " at " + index);
console.log(cityindex);
console.log($scope);
$scope.cities.splice(index, 1);
};
节点侧代码
app.delete('/city', function(req,res){
CityDb.findOneAndRemove({city: req.body.city}, function(err, results){
if (err) throw err;
});
});
最近怎么回事?
heroku上的网站 https://serene-springs-2108.herokuapp.com/#/
github获取完整代码
https://github.com/jminterwebs/STBExpress/tree/MEAN/Public/javascript
答案 0 :(得分:2)
我无法重现您在应用中遇到的错误(也许是因为很多人现在正在从您的实际网站删除内容!),但您的服务器没有响应您的删除请求,这会导致错误控制台也意味着您的角度前端可能会失去同步。
首先,在您的快递应用中回复此请求:
app.delete('/city', function(req,res){
CityDb.findOneAndRemove({city: req.body.city}, function(err, results){
if (err){
res.status(500).send({error: err});
// Assume you are going to catch this somewhere...
throw err;
}
else
res.status(200).send();
});
});
其次,只有在确认删除成功后才从角度范围中删除该项目:
$scope.deleteNote = function(city){
// Make the request
$http({
method: 'DELETE',
url: '/city',
data: city.city,
headers:{"Content-Type": "application/json;charset=utf-8"}
})
// On success:
.then(function (){
var index = $scope.cities.indexOf(city.city);
var cityindex = city.city;
$scope.cities.splice(index, 1);
})
// On error:
.catch(function (){
// Do something better than this:
alert("Something bad happened");
})
.finally(function (){
// Re-enable the button.
city.deleting = false;
})
// Disable the delete button and show a loading animation based on
// this value (use `ng-disabled`).
city.deleting = true;
};
以上内容将确保您的视图准确无误,并与服务器上的内容保持一致。