提问人:Douar Gwenn 提问时间:11/2/2023 最后编辑:Douar Gwenn 更新时间:11/9/2023 访问量:48
如何在 ASP.Net Core Razor 的多个特定页面中重复使用相同的通用页面
How to re-use the same generic page in several specific pages in ASP.Net Core Razor
问:
我是设计和编码的初学者。我正在尝试实现一个简单的基于页面的页面,该页面处理存储在文件中的某些数据的显示和管理。该页面提供了一个用于执行“插入”操作的表单,并在表格中显示文件。表格的每一行都与一个“删除”按钮组合在一起,以删除指定的行。html
razor
cshtml
csv
csv
我想将这个通用页面模型和数据(id-name)模型重新使用到不同的专用页面中:每个页面都有自己的名称,并且基于不同的数据文件(如果基础数据存储在数据库中,则基于不同的表)。
这是我基于简化数据模型(id-name)的代码。
首先,Data.cs 文件中的(简单)模型:
using System.ComponentModel.DataAnnotations;
namespace WebApp.Models
{
public class Data
{
[Key]
public int Id { get; set; }
[Required]
public string? Name { get; set; }
}
}
然后,Data.cshmtl.cs 文件:
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.AspNetCore.Mvc.Rendering;
using WebApp.Models;
namespace WebApp.Pages
{
[BindProperties]
public class DataModel : PageModel
{
private readonly IWebHostEnvironment _webHostEnvironment;
private readonly char[] _delim = { ',' };
private string DataFile => Path.Combine(_webHostEnvironment.WebRootPath, FileName);
public List<Data> DataList { get; set; } = new List<Data>();
public Data DataItem { get; set; } = new Data();
public string TitleName { get; set; } = "Data Set";
public string FileName { get; set; } = "FileName.csv";
public string[] Headers = new string[]
{
"Id",
"Name",
};
private void LoadFile()
{
<!-- Loading DataFile to DataList -->
}
public void InsertIntoFile(Data dataNew)
{
<!-- Inserting dataNew into DataList and DataFile -->
}
public void DeleteFromFile(Data dataOld)
{
<!-- Deleting dataOld from DataFile -->
}
public DataModel(IWebHostEnvironment webHostEnvironment)
{
_webHostEnvironment = webHostEnvironment;
}
public void OnGet()
{
LoadFile();
}
public IActionResult OnPostInsert()
{
InsertIntoFile(DataItem);
LoadFile();
return Page();
}
public IActionResult OnPostDelete()
{
DeleteFromFile(DataItem);
LoadFile();
return Page();
}
}
}
最后,Data.cshtml 文件:
@page
@using WebApp.Models;
@model WebApp.Pages.DataModel
@{
ViewData["Title"] = @Model.TitleName;
}
<h2>@ViewData["Title"]</h2>
<form method="post" asp-page-handler="Insert">
<div>
<label>
<text>Data id: </text>
<input asp-for="DataItem.Id" required placeholder="Enter the data id">
<text>Data name: </text>
<input asp-for="DataItem.Name" required placeholder="Enter the data name">
</label>
</div>
<br />
<div>
<button type="submit" class="btn btn-primary">
Insert
</button>
</div>
</form>
<br />
<div style="overflow-y:scroll; height:400px;">
<table class="table table-bordered table-striped">
<thead>
<tr>
@foreach (string header in Model.Headers)
{
<th>@header</th>
}
<th>Delete</th>
</tr>
</thead>
<tbody>
@foreach (Data dataItem in Model.DataList)
{
<tr>
<td>@dataItem.Id</td>
<td>@dataItem.Name</td>
<td>
<form method="post" asp-page-handler="Delete">
<input type="hidden" asp-for="@dataItem.Id" required>
<input type="hidden" asp-for="@dataItem.Name" required>
<button type="submit" class="btn btn-danger">
Delete
</button>
</form>
</td>
</tr>
}
}
</tbody>
</table>
</div>
我真的不知道如何从那里开始,以便重用这个框架来管理来自/到相应页面上的任何其他文件的数据:我想分解这段代码(我想在不同的页面上使用相同的插入/删除/表框架,而不必重写同样的东西),简单的区别是我需要为每个不同的页面定位不同的底层文件。csv
到目前为止,我所做的是将上述 Data.cshtml.cs 文件的构造函数修改为
public DataModel(IWebHostEnvironment webHostEnvironment, string titleName, string fileName)
{
_webHostEnvironment = webHostEnvironment;
TitleName = titleName;
FileName = fileName;
}
并创建另一个视图,其中 Data1.cshtml.cs 文件如下所示:razor
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace WebApp.Pages
{
[BindProperties]
public class Data1Model : PageModel
{
private readonly IWebHostEnvironment _webHostEnvironment;
public string TitleName = "Data Set 1";
public string FileName = "File1Name.csv";
public Data1Model(IWebHostEnvironment webHostEnvironment)
{
_webHostEnvironment = webHostEnvironment;
}
public void OnGet()
{
DataModel data = new DataModel(_webHostEnvironment, TitleName, FileName);
data.OnGet();
}
}
}
和 Data1.cshtml 文件(带有一些参数冗余)如下所示:
@page
@using WebApp.Models;
@model WebApp.Pages.Data1Model
@{
Layout = "Data";
}
<a asp-page="Data"
asp-route-titleName="Data Set 1"
asp-route-fileName="File1Name.csv"></a>
它不适用于 Data1.cshtml.cs 的 OnGet()(它遍历代码但不呈现任何结果),我不知道如何实现操作 OnPostInsert() 和 OnPostDelete()。
答: 暂无答案
评论
partial
<partial name="...." />
Model