在部分页面中使用 asp-for TagHelper

Using asp-for TagHelper in Partial Page

我创建了一个 ViewComponent 来在我的 WebApp 中显示弹出窗口,这个 VC 仅用作 html 的 shell(使用 bootstrap 模式)和弹出内容是通过 javascrit 从部分页面加载的。

当我尝试在部分内容中使用 asp-for 标记助手时,出现此错误:

System.ArgumentNullException: Value cannot be null. (Parameter 'viewData')
   at Microsoft.AspNetCore.Mvc.ViewFeatures.ModelExpressionProvider.CreateModelExpression[TModel,TValue]
(ViewDataDictionary`1 viewData, Expression`1 expression)

我已经将 @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 添加到页面,因为我认为 ViewImports 尚未加载。

这些是使用的文件:

<!-- Pages/Shared/Components/Popup/default.cshtml -->
@model App.ViewComponents.PopupViewModel

<div class="modal @Model.CssClasses" id="@Model.Id" tabindex="-1" role="dialog" aria-labelledby="@Model.LabeledBy" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header border-bottom-0">
                <h5 class="modal-title" id="exampleModalLabel">@Model.Title</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
            </div>
        </div>
    </div>
</div>


<script>
    $('#@Model.Id').on('show.bs.modal', function (e) {
        $.get("@Model.ContentPage",
            null,
            data => {
                $("#@Model.Id").modal("show");
                $("#@Model.Id .modal-body").html(data);
            });
    })
</script>
// ViewComponents/Popup.cs
namespace App.ViewComponents
{
    public class Popup : ViewComponent
    {
        public Popup()
        {
        }

        public async Task<IViewComponentResult> InvokeAsync(PopupViewModel model)
        {
            return View(model);
        }
    }

    public class PopupViewModel
    {
        public PopupViewModel()
        {

        }

        public string Id { get; set; }
        public string ContentPage { get; set; }
        public string Title { get; set; }
        public string SubTitle { get; set; }
        public string CssClasses { get; set; }
        public string LabeledBy { get; set; }
    }
}

这就是我加载弹出内容的方式(ajax 从 VC 调用它):

public PartialViewResult OnGetCreate()
{
    var createPageModel = new CreateModel();
    return Partial("Create", createPageModel);
}

这是部分内容:

@page
@model App.Pages.CreateModel
@{
}


<form method="post">
    <!-- This works -->
    @Html.LabelFor(m => m.InputModel.Name)
    @Html.EditorFor(m => m.InputModel.Name, new { @class = "form-control" })

    <!-- This don't work -->
    <label asp-for="InputModel.Description"></label>
    <input asp-for="InputModel.Description" />
})

    <button id="submit" asp-page-handler="New" class="btn btn-primary">Create</button>
</form>

有人对此有任何线索吗? 谢谢。

部分顶部的@page 为空,导致此错误。