在部分页面中使用 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">×</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 为空,导致此错误。
我创建了一个 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">×</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 为空,导致此错误。