Robert Luongo Robert Luongo - 18 days ago 5
AngularJS Question

Angular API PUT-DELETE methods keep returning 404 Not Found

this is happening despite not having any issues with the actual client calls and the server implementation of these API methods, any suggestion more than welcome !! see below

Client Function Implementation inside Angular Controller

function updateData() {
dataService.put("/api/Product/" +
vm.product.ProductId,
vm.product)
.then(function (result) {
// Update product object
vm.product = result.data;

// Get index of this product
var index = vm.products.map(function (p)
{ return p.ProductId; })
.indexOf(vm.product.ProductId);

// Update product in array
vm.products[index] = vm.product;

setUIState(pageMode.LIST);
}, function (error) {
handleException(error);
});
}


API Implementation

[HttpPut()]
public IHttpActionResult Put(int id,
Product product) {
IHttpActionResult ret = null;
PTCViewModel vm = new PTCViewModel();

vm.Entity = product;
vm.PageMode = PageConstants.EDIT;
vm.Save();

if (vm.IsValid) {
ret = Ok(product);
}
else if (vm.Messages.Count > 0) {
ret = BadRequest(ConvertToModelState(vm.Messages));
}
else {
ret = NotFound();
}

return ret;
}

[HttpDelete()]
public IHttpActionResult Delete(int id) {
IHttpActionResult ret = null;
PTCViewModel vm = new PTCViewModel();

// Get the product
vm.Entity = vm.Get(id);
// Did we find the product?
if (vm.Entity.ProductId > 0) {
// Delete the product
vm.Delete(id);

ret = Ok(true);
}
else {
ret = NotFound();
}

return ret;
}

Answer

Issue was using a new version of Angular, all API methods calls are successful as long as the Angular version is 1.x and not 2.x, this is because the syntax to make the PUT and the DELETE calls in Angular 2.x is different and that explains why these end points were returning a 404 Not Found error.

Comments