如何解决如何将图片添加到我的 Razor Page 项目中?
我正在制作一个应该用作电影租赁网站的项目。我需要有我选择的所有电影的封面。我将如何在我的项目中做到这一点?如果可以,我更喜欢 HTML,因为我最喜欢它。我正在使用 Razor Pages .NET CORE,我的语言是 C#。我还将所有需要的图像存储到程序中已经存在的文件中,以便完成。这是我的代码:
对于我的模型类(这仅显示封面照片的模型):
[display(Name = "Cover Photo")]
[Column(TypeName = "varchar(128)")]
public string Cover_Photo { get; set; }
<p>
<a asp-page="Create">Create New</a>
</p>
<table class="table">
<thead>
<tr>
<th>
@Html.displayNameFor(model => model.Movie[0].Title)
</th>
<th>
@Html.displayNameFor(model => model.Movie[0].ratingId)
</th>
<th>
@Html.displayNameFor(model => model.Movie[0].Description)
</th>
<th>
@Html.displayNameFor(model => model.Movie[0].Length)
</th>
<th>
@Html.displayNameFor(model => model.Movie[0].GenreId)
</th>
<th>
DVD / BluRay
</th>
<th>
@Html.displayNameFor(model => model.Movie[0].Cover_Photo)
</th>
<th>
@Html.displayNameFor(model => model.Movie[0].Release_Date)
</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.Movie) {
<tr>
<td>
@Html.displayFor(modelItem => item.Title)
</td>
<td>
@Html.displayFor(modelItem => item.rating.Name)
</td>
<td>
@Html.displayFor(modelItem => item.Description)
</td>
<td>
@Html.displayFor(modelItem => item.Length)
</td>
<td>
@Html.displayFor(modelItem => item.Genre.Name)
</td>
<td>
@Html.displayFor(modelItem => item.Is_Dvd) / @Html.displayFor(modelItem => item.Is_BluRay)
</td>
<td>
@Html.displayFor(modelItem => item.Cover_Photo)
</td>
<td>
@Html.displayFor(modelItem => item.Release_Date)
</td>
<td>
<a asp-page="./Edit" asp-route-id="@item.MovieId">Edit</a> |
<a asp-page="./Details" asp-route-id="@item.MovieId">Details</a> |
<a asp-page="./Delete" asp-route-id="@item.MovieId">Delete</a> |
<a asp-page="../Reviews/Create" asp-route-id="@item.MovieId">Add Review</a>
</td>
</tr>
}
</tbody>
</table>
我也有一个 cshtml.cs 文件,但我不确定它是做什么用的或里面有什么。谢谢!所有帮助都得到了应用!
解决方法
所有信息都在表格中,但我似乎无法弄清楚如何显示图片。
那是因为您没有使用 <img />
元素。更改如下:
<img src="@item.Cover_Photo" />
确保您在 wwwroot/Pictures
中有照片:
还要确保您的 Cover_Photo
属性存储的值如下所示:
public List<TestModel> Movie { get; set; }
public IActionResult OnGet()
{
Movie = new List<TestModel>()
{
new TestModel(){ Cover_Photo="Pictures/book1.jpg"},new TestModel(){ Cover_Photo="Pictures/book2.jpg"}
};
return Page();
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。