data-src-retina для тега изображения с .NET Core

Question

Я работаю в проекте .NET Core 2.0. Есть ли способ получить относительный путь изображения и передать его одному из атрибутов data-*?

У меня есть такое изображение:

<img src="~/images/avatar.jpg" data-src="~/images/avatar.jpg" data-src-retina="~/images/avatar2x.jpg" asp-append-version="true" width="69" height="69" />

Это не работает на дисплеях с высоким разрешением, потому что он пытается получить статический путь в data-src-retina. Это, однако, работает

<img src="~/images/avatar.jpg" asp-append-version="true" width="69" height="69" />

Но теперь я не могу загрузить версию изображения с высоким разрешением для дисплеев сетчатки.

Есть ли способ передать относительный путь изображения к атрибутам data-* в .NET Core?

Answer 1

Поскольку data-src-retina - это не ядро ​​.Net Core или Razor, поэтому префикс пути ~ не работает. Вместо этого вам нужно преобразовать строку в относительный путь. Для этого вы можете использовать Url.Content(). Например:

<img src="~/images/avatar.jpg" 
     data-src="@Url.Content("~/images/avatar.jpg")" 
     data-src-retina="@Url.Content("~/images/avatar2x.jpg")" 
     asp-append-version="true" width="69" height="69" />