0

我想要达到的目标：

使用 LazyLoad 的data-original属性，同时为我的相对根路径保留 ASP.NET 的~/路径标识符！

问题是什么：

data-original属性不会将 my~/转换为我的图像的相对根路径

正常的图像路径：

<img src="www/folder/file.png" />

ASP.NET Core 路径： 这需要 ~/ 告诉 ASP.NET 它来自根相对路径

<img src="~/folder/file.png" />

LazyLoad 的图片

<img data-original="/folder/file.png" />

有没有人有任何经验让相对根路径与 LazyLoad 的data-original属性一起正常工作？

我已经尝试过这样做：

<img data-original="~/folder/file.png" />

但它不起作用

4

1 回答 1

0

我自己想出了答案。我决定在控制器中创建自己的相对根路径变量，然后将值返回到视图中。那时我所要做的就是使用 Razor Markup 插入变量并完成！

我的环境：

  • .NET 核心 1.1
  • ASP.NET 核心

控制器：

IHostingEnvironment服务有两个特别感兴趣的属性：ContentRootPath和WebRootPath。出于我的目的，我将使用ContentRootPath，因为我想访问相对根路径，或者换句话说wwwroot 

private readonly IHostingEnvironment _hostingEnvironment;

public HomeController(IHostingEnvironment hostingEnvironment)
{
    _hostingEnvironment = hostingEnvironment;
}

确保将命名空间添加到文件中！

using Microsoft.AspNetCore.Hosting;

在我想要的控制器中完成基础工作之后，在同一个文件中，我只想要一个特定的页面来利用我的工作。Index为了简单起见，它将在示例代码中表示。

public IActionResult Index()
{
    ViewBag.wwwRootPath = _hostingEnvironment.ContentRootPath;
    return View();
}

看法：

似乎微软在运行时或构建时的 .NET Core 仅在其位于元素~/内的属性内时才会转换为相对根目录。src因此，那些使用 3rd 方库或需要指定非src调用文件方式的人，在他们添加可扩展性之前，此解决方案就足够了。

我将使用问题中的示例作为解决方案的示例。因此，如前所述，此代码在应用程序中不起作用。

<img data-original="~/folder/file.png" />

解决方案：

<img data-original="@ViewBag.wwwRootPath/folder/file.png" />

注意：这也适用于 JavaScript 和 CSS！只需将其ViewBag.wwwRootPath放在您想要的文件中以保持一致性！

于 2017-02-18T18:28:54.603 回答