Escaping @ in Blazor

Question

I want to display image from icon library in Blazor component.

The path is:

wwwroot/lib/@icon/open-iconic/icons/account-login.svg

But @ is a special character in Blazor.

Answer 1

Quoting Razor syntax:

To escape an @ symbol in Razor markup, use a second @ symbol:

<p>@@Username</p>

The code is rendered in HTML with a single @ symbol:

<p>@Username</p>

Answer 2

Just add another @ symbol. So your exmaple:

wwwroot/lib/@@icon/open-iconic/icons/account-login.svg

will render as:

wwwroot/lib/@icon/open-iconic/icons/account-login.svg