C#.net core 6 如何將局部視圖轉換為 json / html 字符串

Question

我想通過一次調用來刷新局部視圖（主視圖）以減少 .network 上的流量。 一個局部視圖內部有多個局部視圖（子視圖）。 但是，我不能使用標准的mainpartialview.html(response)方法，因為其中一個子局部視圖與腳本文件有沖突。 我想繼續使用JSON但是 model 中 languageForm 和 translationForm 的值是空的。我發現的建議是要求我使用microsoft.as.netcore.mvc.viewfeatures但是它不適用於Net 6 。

舊方法

retun PartialView("~/Views/Facility/Translation/_PanelMain.cshtml", result);

新的方法

return Json(new
                {
                    languageForm = PartialView("~/Views/Facility/Translation/_Form_Language.cshtml", result.record),
                    translationForm = PartialView("~/Views/Facility/Translation/_PanelSub.cshtml", result.subRecord),
                    translationViewModel = result.subRecord
                });

從接受的答案中，以下是完整的解決方案

C# Controller

[HttpGet]
public async Task<ActionResult> GetLanguageRecord(long? languageID)
{
    LoadViewBag();

    var loadOptions = GetDefaultDataSourceLoadOptions();
    var languageList = _languageService.GetGridViewList(GetMembershipID(), null, loadOptions);
    var translationList = _translationService.GetGridViewList(GetMembershipID(), languageID, loadOptions);

    var result = PopulateViewModel(languageID ?? 0, 0, languageList, translationList, loadOptions);
    result.record.TransactionTypeID = SubmissionType.Edit;

    var services = HttpContext.RequestServices;
    var options = services.GetRequiredService<IOptions<MvcViewOptions>>().Value;
    var executor = (PartialViewResultExecutor)services.GetRequiredService<IActionResultExecutor<PartialViewResult>>();

    return Json(new
    {
        languageForm = await Render(
            options,
            ControllerContext,
            PartialView("~/Views/Facility/Translation/_Form_Language.cshtml", result.record),
            executor),
        translationForm = await Render(
            options,
            ControllerContext,
            PartialView("~/Views/Facility/Translation/_PanelSub.cshtml", result.subRecord),
            executor),
        translationViewModel = result.subRecord
    });
}

Javascript

function grdMain_Language_selection_changed(selectedItems) {

    var data = selectedItems.selectedRowsData[0];
    if (data) {

        $.ajax({
            type: "GET",
            url: "Translation/GetLanguageRecord",
            data: { languageID: data.ID },
            cache: false,
            success: function (response) {
                document.getElementById("_EntryForm_Language").innerHTML = response.languageForm;
                document.getElementById("_SubPanel").innerHTML = response.translationForm; 
                $('#_subPanel_body').collapse('hide');
                $('#_mainPanel_body').collapse('show');

                myData_Translation = response.translationViewModel.recordList;
                myTotalCount_Translation = response.translationViewModel.recordTotal;
                let gvElement_Translation = document.getElementById("grdSub_Translation");
                let gvInstance_Translation = DevExpress.ui.dxDataGrid.getInstance(gvElement_Translation);
                gvInstance_Translation.refresh();
            }
        });

        $(window).scrollTop(0);
    }
}

Answer 1

快速瀏覽return PartialView("viewname");的內部實現后； . 我認為這是將局部視圖呈現為字符串所需的最低限度；

public async Task<string> Render(MvcViewOptions options, ActionContext context, PartialViewResult result, PartialViewResultExecutor executor)
{
    var viewEngineResult = executor.FindView(context, result);
    viewEngineResult.EnsureSuccessful(originalLocations: null);
    var view = viewEngineResult.View;
    using (view as IDisposable)
    {
        using var writer = new StringWriter();
        var viewContext = new ViewContext(
            context,
            view,
            result.ViewData,
            result.TempData,
            writer,
            options.HtmlHelperOptions);

        await view.RenderAsync(viewContext);
        await writer.FlushAsync();

        return writer.ToString();
    }
}

您會喜歡使用哪個；

var services = HttpContext.RequestServices;
var options = services.GetRequiredService<IOptions<MvcViewOptions>>().Value;
var executor = (PartialViewResultExecutor)services.GetRequiredService<IActionResultExecutor<PartialViewResult>>();
            
return Json(new {
    languageForm = await Render(
        options,
        ControllerContext,
        PartialView("~/Views/Facility/Translation/_Form_Language.cshtml", result.record),
        executor),
    ...
});

通過更多的努力，您可能可以使用Utf8JsonWriter將每個視圖 html 直接渲染到響應主體，而無需任何緩存。