JSON 数据未保存在 WebAPI 中

Question

I'm following a Pluralsight course on AngularJS and WebAPI together. I'm trying to save data being sent from the client to the server using PUT , but the data is not saving and I'm not getting any errors. Also, It doesn't event hit the correct server side code because the breakpoints are not being caught. I've tried to change the type of HTTP method, but I need this one. The only thing being sent back is a "204: No Content" code from the server.

This is how the PUT and POST methods look like. Breakpoints in any of these methods will not be captured.

// POST: api/Products
public void Post([FromBody]Product product) // Creating a product
{
    var productRepository = new ProductRepository();
    var newProduct = productRepository.Save(product);
}
// PUT: api/Products/5
public void Put(int id, [FromBody]Product product) // Updating a product
{
    var productRepository = new ProductRepository();
    var updatedProduct = productRepository.Save(id, product);
}

ProductRepository looks like this:

internal Product Save(Product product)
{
    // Read in the existing products
    var products = this.Retrieve();
    // Assign a new Id
    var maxId = products.Max(p => p.ProductID);

    product.ProductID = maxId + 1;
    products.Add(product);

    WriteData(products);

    return product;
}

internal Product Save(int id, Product product)
{
    // Read in the existing products
    var products = this.Retrieve();

    // Locate and replace the item
    var itemIndex = products.FindIndex(p => p.ProductID == product.ProductID);
    if (itemIndex > 0)
    {
        products[itemIndex] = product;
    }
    else
    {
        return null;
    }

    WriteData(products);
    return product;
}

This is the main part of the controller that is being used (using Controller-As syntax :

var vm = this;
vm.submit = function () {
    vm.message = "";
    if (vm.product.productID) {
        vm.product.$update({ id: vm.product.productID }, function (data { 
            console.log(data);
            vm.message = "Save Complete";
        });
    } else {
        vm.product.$save(function (data) {
            vm.originalProduct = angular.copy(data);
            vm.message = "Save Complete";
        });
    }
};

Finally, productResource is a custom service that looks like this:

var productResource = function($resource, appSettings) {
    return $resource(appSettings.serverPath + "/api/Products/:id", null, {
        'update': { method: 'PUT' }
    });
}

I've tried to look to see if it's a CORS problem, but it's not since I have it enabled at the class level.

Answer 1

请检查您的 API 是否实现了 CORS（跨源资源共享）

Answer 2

Shouldn't

var itemIndex = products.FindIndex(p => p.ProductID == product.ProductID);

be

var itemIndex = products.FindIndex(p => p.ProductID == id);