javascript - 如何正确地将 javascript 与 razor 语法结合起来

Question

我的 razor View 中有以下代码，我需要设置一些 JavaScript 变量来设置来自 razor 的值。

但是变量的值尚未设置。

var listPuntos =[];
    function onSelect(e) {
        var dataItem = this.dataSource.view()[e.item.index()];
        @{
            var proveedorID = 0;
            <text>proveedorID = dataItem.ProveedorID</text>
            var list = new UnitOfWork().PuntosVentaProveedorRepository.Get().Where(x => x.ProveedorID == proveedorID);
            proveedorID = 0;
            <text>listPuntos = list; </text>;
            <text>
                var displayText;
                $.each(listPuntos, function (key, value) {
                    if (displayText == undefined)
                        displayText = value.Nombre + ', ';
                    else
                        displayText = displayText + value.Nombre + ', ';
                });
                document.getElementById("puntos").value = displayText.slice(0,-2);
            </text>
        }

    }

Answer 1

鉴于您的具体示例，我将首先减少 <text> 的数量只需用 @{ … } 包装较短的 C# 位即可所需的 block 。这提高了可读性并减少了困惑。例如:

var listPuntos =[];
    function onSelect(e) {
        var dataItem = this.dataSource.view()[e.item.index()];
        @{ var proveedorID = 0; }
        proveedorID = dataItem.ProveedorID;
        @{ var list = new UnitOfWork().PuntosVentaProveedorRepository.Get().Where(x => x.ProveedorID == proveedorID); }
        proveedorID = 0;
        listPuntos = @Json.Encode(list);
        var displayText;
        $.each(listPuntos, function (key, value) {
            if (displayText == undefined)
                displayText = value.Nombre + ', ';
            else
                displayText = displayText + value.Nombre + ', ';
        });
        document.getElementById("puntos").value = displayText.slice(0,-2);
    }

接下来，要将 C# 值注入(inject)到服务器发出的 JavaScript 代码中，您需要在 JavaScript 中对该值进行编码。最好的方法是将其转换为 JSON。这是上面使用 Json.Encode 完成的。特别是，该行读取:

        listPuntos = @Json.Encode(list);

我用过Json.Encode但当然，您可以自由使用任何适合您项目的 JSON 库。