我想在razor中遍历我的模型列表，以填充jquery列

我想从一个列表中生成一个表，但是我不知道怎么做。 这是我得到的错误的图片

这是我的html代码

<table id="extracionTable" class="display nowrap" style="width: 100%;">
    <thead>
        <tr>
            @foreach (var item in Model.contactos)
            {
                <th>@item.nombre_contacto</th>
            }
    </thead>
</table>

这是jQuery代码

<script>

    $(document).ready(function () {
        var table = $('#extracionTable').DataTable({
            rowReorder: {
                selector: 'td:nth-child(2)'
            },
            responsive: true,
            "ajax": {
                "url": "/gestionDeEmpleados/loadEmployeTable",
                "type": "GET",
                "datatype": "json"
            },
            "columns": [
                @foreach (var item in Model.contactos) { 
                { "data": @item, "autoWidth": true },/* index = 0 */
                }
            ]
        });
    });
    $("#open-new").click(function (event) {
        event.stopPropagation();
    });
</script>

---

如何修复此问题。

首先，问题是您的代码令人困惑。例如，您有花括号，用于javascript对象，但Razor认为它们是C代码的一部分

我认为最好的方法是将数据转换为JSON，并以这种方式发送到视图。然后让jQuery访问这个JSON并使用它。这种方法的优点是，您的javascript不再需要存在于视图上，而视图并不真正属于它。如果你愿意的话，我可以进一步扩展吗

如果你真的想按照你所展示的方式去做，那么一个方法就是把你的第二个foreach改成这个

@foreach (var item in Model.contactos) 
            {
                <text>
                    { "data": "@(item.nombre_contacto)", "autoWidth": true },
              </text>
           }

---

注意，我添加了dataSrc属性。读取datatable文档时，它表示dataSrc选项用于告诉DataTables数据数组在JSON结构中的位置，因此空字符串可能不适合您。请参阅以了解更多信息。

首先，问题是您的代码令人困惑。例如，您有花括号，用于javascript对象，但Razor认为它们是C代码的一部分

我认为最好的方法是将数据转换为JSON，并以这种方式发送到视图。然后让jQuery访问这个JSON并使用它。这种方法的优点是，您的javascript不再需要存在于视图上，而视图并不真正属于它。如果你愿意的话，我可以进一步扩展吗

如果你真的想按照你所展示的方式去做，那么一个方法就是把你的第二个foreach改成这个

@foreach (var item in Model.contactos) 
            {
                <text>
                    { "data": "@(item.nombre_contacto)", "autoWidth": true },
              </text>
           }

---

注意，我添加了dataSrc属性。读取datatable文档时，它表示dataSrc选项用于告诉DataTables数据数组在JSON结构中的位置，因此空字符串可能不适合您。请参阅以了解更多信息。

就像Dave说的，razor中的foreach代码都有大括号，后面是javascript的大括号。你需要告诉razor如何解释它。 更确切地说，类似的方法是：

 @foreach (var item in Model.contactos) { 
            <text>
                { "data": @(item.nombre_contacto), "autoWidth": true },/* index = 0 */
            </text>
 }

---

这样，我认为它更可读，@会打印出里面的值，就像Dave说的，razor中的foreach代码有大括号，然后是javascript的大括号。你需要告诉razor如何解释它。 更确切地说，类似的方法是：

 @foreach (var item in Model.contactos) { 
            <text>
                { "data": @(item.nombre_contacto), "autoWidth": true },/* index = 0 */
            </text>
 }

---

---

这样我认为它更可读，@会打印出代码内部的值，当您运行代码时，您是否真的遇到了错误？很多时候，当您混合使用不同的语言时，IDE错误地显示错误，但代码实际上是好的。我不熟悉Razor，但是如果后端正在处理以@开头的代码，那么代码应该是好的。附言：魁北克你好！是的，我试过了，我得到了一个错误，上面写着期待；感谢魁北克大学的chère Inconue du québec。如果您查看呈现的源代码，columns对象的输出是什么？另外，为了确保错误来自该代码行，请在不使用ASP代码的情况下硬编码对象。类似于：columns:[{data:name}，{data:position}]，没有asp.net代码，它可以正常工作。当您运行代码时，是否真的出现错误？很多时候，当您混合使用不同的语言时，IDE错误地显示错误，但代码实际上是好的。我不熟悉Razor，但是如果后端正在处理以@开头的代码，那么代码应该是好的。附言：魁北克你好！是的，我试过了，我得到了一个错误，上面写着期待；感谢魁北克大学的chère Inconue du québec。如果您查看呈现的源代码，columns对象的输出是什么？另外，为了确保错误来自该代码行，请在不使用ASP代码的情况下硬编码对象。类似于：columns:[{data:name}，{data:position}]没有asp.net代码，它可以正常工作。谢谢，但是它对我不起作用。当我检查元素时，我可以看到它生成了以下代码$document.readyfunction{var table=$'extracionTable'。DataTable{ajax:{url:/extraccion/loadExtraccionTable，类型：GET，数据类型：json，}，行重新排序：{selector:'td:nth-child2'}，responsive:true，列：[{{data:tata，autoWidth:true}，…但是它没有任何作用我认为它缺少引号。现在尝试使用引号谢谢，我已经添加了引号，但是仍然不起作用我得到了相同的结果，但是数据值周围有引号。你是否使用开发人员工具查看控制台，它是否显示任何错误？是的，但是我没有看到任何错误谢谢，不管它是什么这对我不起作用我什么时候能看出来

---

我检查元素，它已生成以下代码$document.readyfunction{var table=$'extracionTable'。DataTable{ajax:{url:/extraccion/loadExtraccionTable，type:GET，datatype:json，}，rowReorder:{selector:'td:nth-child2}，响应：true，列：[{{data:tata，autoWidth:true}，…但是它没有任何作用我认为它缺少引号。现在尝试使用引号谢谢，我添加了引号，但仍然不起作用我得到了相同的结果，但数据值周围有引号。你是否使用开发人员工具查看控制台，它是否显示任何错误？是的，但我没有看到任何错误