Question

我使用JQuery Ajax从Web API中提取一些数据，如下所示：

<script>
    $(document).ready(function () {
        $.ajax({
            type: 'GET',
            url: 'http://localhost:43618/api/Products',
            dataType: 'json',
            success : function(data) {
              //some code goes here
            }
        });
    });
</script>

现在，我想在以下视图中将提取的数据绑定到MVC 模型：

@model IEnumerable<CosumingWebAPIJQuery.Models.Product>
<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Name)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Price)
        </th>
        <th></th>
    </tr>
    @if (Model != null)
    {
        foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.Name)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Price)
                </td>

            </tr>
        }
    }

</table>

那么如何将拉出的JSON 数据转换为MVC 模型对象并将其绑定到View以显示列表中的数据??任何帮助请??

Answer 1

你不能！您的web api将以JSON格式返回数据（除非您指定不同的接受标头）。通常剃刀代码在服务器中执行，html标记将是输出。在您的情况下，您在客户端有json数组。你不能在那里执行razor代码。

一个解决方案（糟糕的解决方案）是将json再次发布到MVC操作方法，然后将其传递（在转换为c＃类集合之后）到部分视图并返回视图结果。

更好的解决方案是调用MVC Action方法，该方法获取数据并返回部分视图结果标记。因此，您将在Web项目中调用MVC操作方法，而不是调用web api端点。如果web api项目是MVC Web项目的一部分，则应考虑将返回数据的代码移动到公共服务类方法（可以从Web api控制器和MVC操作方法调用）。

一旦从ajax调用获得结果，这是部分视图返回的HTML标记，只需根据需要修改DOM。

将JSON数据转换/绑定到ASP.NET MVC模型对象

1 个答案: