创建 ID 列表并保存到不同的 API

Question

我 link 将两个 API 放在一起（客户和手机），并使用他们的 ID link 一个客户使用许多手机并节省第三个 'Purchase' API。由于客户可以拥有许多手机，因此我需要一个 HandsetIds 列表。

这在购买表格 (https://i.stack.imgur.com/4zcmP.png) 上运行良好，但是我的 'HandsetIds' 有一个空值，这使我无法 post 进入 [=43] =].

在下面我的 newPurchasesController 的摘录中，当我在 _context.Purchases.Add(purchase) 上设置断点时；并在表单中输入值，我得到一个 NotSupportedException（空常量类型）并且 HandsetIds 是一个 _emptyArray {int[0]}。

 [HttpPost]
    public IHttpActionResult CreateNewPurchases(NewPurchaseDto newPurchase)
    {
        var customer = _context.Customers.Single(
      c => c.Id == newPurchase.CustomerId);

        var handsets = _context.Handsets.Where(
       m => newPurchase.HandsetIds.Contains(m.Id)).ToList();


        foreach (var handset in handsets)
        {
            var purchase = new Purchase
            {
                Customer = customer,
                Handset = handset,
                DatePurchased = DateTime.Now
            };

            _context.Purchases.Add(purchase);
        }
        _context.SaveChanges();

        return Ok();
    }
}

我在运行程序时得到客户 ID 的期望值。

我的 NewPurchaseDto:

 public class NewPurchaseDto
{
    public int CustomerId { get; set; }
    public List<int> HandsetIds { get; set; }
}

此外，这里有一个 link 更多相关代码（完整的控制器、模型等）在我在本期开头制作的早期 SO post 中： API returning null values for linked table IDs

我花了很多时间试图弄清楚这个问题，非常感谢一些指导。谢谢！

这是我的观点（由于某些原因，它在 html 之前保存为 js）：

@section scripts
{
    <script>
        $(document).ready(function () {
            // twitter.github.io/typeahead.js/examples/#remote modified for my own use

            var vm = {
                                movieIds: []
            };

        var customers = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            remote: {
                url: '/api/customers?query=%QUERY',
                wildcard: '%QUERY'
            }
        });


       $('#customer').typeahead({
                minLength: 2,
                highlight: true
            }, {
                name: 'customers',
                display: 'name',
                source: customers
            }).on("typeahead:select", function(e, customer) {
                vm.customerId = customer.id;
            });

            var handsets = new Bloodhound({
                datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
                queryTokenizer: Bloodhound.tokenizers.whitespace,
                remote: {
                    url: '/api/handsets?query=%QUERY',
                    wildcard: '%QUERY'
                }
            });

            $('#handset').typeahead({
                minLength: 2,
                highlight: true
            }, {
                name: 'handsets',
                display: 'name',
                source: handsets
            }).on("typeahead:select", function (e, handset) {
                $("#handsets").append("<li class='list-group-item'>" + handset.name + "</li>");

                $("#handset").typeahead("val", "");

               

                vm.handsetIds.push(handset.id);
            });

            $("#newPurchase").submit(function (e) {
                e.preventDefault();

                $.ajax({
                    url: "/api/newPurchases",
                    method: "post",
                    data: vm
                })
                    // Display toast notifications
                .done(function () {
                    toastr.success("Purchases successfully recorded");
                })
                .fail(function () {
                    toastr.error("Something wrong happened");
                });
            });
        });
    </script>
}

@model dynamic
@{
    ViewBag.Title = "New Purchase Form";

}

<h2>New Purchase form</h2>


<form id="newPurchase">
    <div class="form-group">
        <label>Customer</label>
        <div class="tt-container">
            <input id="customer" type="text" value="" class="form-control" />
        </div>
    </div>

    <div class="form-group">
        <label>Handset</label>
        <div class="tt-container">
            <input id="handset" type="text" value="" class="form-control" />
        </div>
    </div>

    <div class="row">
        <div class="col-md-3 col-sm-3">
            <ul id="handsets" class="list-group"></ul>
        </div>
    </div>

    <button class="btn btn-primary">Submit</button>
    

</form>

Answer 1

这个问题是因为您在 jQuery.

中创建的 vm 对象中的 movieIds 属性

首先，您在控制器中收到空引用异常，因为 newPurchase.HandSetIds 为空。

在您的 ajax 中，您正在向服务器提交 vm 对象。

您的 jQuery 中有一行：vm.handsetIds.push(handset.id); 向名为 handsetIds 的数组添加值，但您没有名为属性的数组handsetIds 在您的 vm 对象中。但是，您的 vm 对象中确实有一个名为 movieIds 的数组属性。所以只需将 movieIds 重命名为 handsetIds 即可解决您的问题。

创建 ID 列表并保存到不同的 API

Creating a list of IDs and saving to a different API

asp.net-mvc

nullreferenceexception