Как динамически добавлять ссылки на файлы CSS и Javascript в ASP.NET Core - PullRequest
0 голосов
/ 10 января 2019

У нас есть CMS, которую мы хотим преобразовать в .NET Core. В нашей CMS мы можем добавлять страницы и шаблоны, включая шаблоны CSS и Javascript. На странице мы можем выбрать один или несколько шаблонов CSS и / или Javascript, которые должны быть загружены на эту страницу.

Чтобы это работало, я хотел бы динамически создать URL-адрес файла CSS или Javascript внутри моего контроллера (или службы) и добавить этот файл в мой _Layout.cshtml. На данный момент я делаю что-то вроде этого:

Мой метод контроллера:

public IActionResult Test() 
{
    var listOfCssIds = new List<int>() { 1, 2, 3 };
    var cssFile = $"/css/customCss_{String.Join("_", listOfNumbers)}.css";
    ViewData["MyCssFile"] = cssFile;
    return View();
}

Мой _Layout.cshtml:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    @{
        if (@ViewData["MyCssFile"] != null)
        {
            <link href="@ViewData["MyCssFile"]" rel="stylesheet" />
        }
    }
</head>
<body>
    <h1>Layout from library</h1>
    @RenderBody()
</body>
</html>

Мы также можем добавить ссылки на внешние файлы CSS / Javascript, например, на CDN. Мы также хотим добавить их к нашему мнению. Я могу сделать это так же, как приведенный выше код, но это неправильно, и мне интересно, есть ли лучший способ сделать это?

Я думал об использовании разделов и добавлении @RenderSection() к своему _Layout.cshtml, но я не могу найти, как добавить материал в раздел через контроллер или службу, кажется, что это возможно сделать только в другом вид.

Я искал в Интернете ответы / идеи, но ничего не могу найти. Может кто-нибудь сказать мне, каковы лучшие практики для подобных случаев?

У меня такой же вопрос к HTML, наша CMS решает большую часть HTML, которую должна иметь страница. В настоящее время я строю этот HTML в моем контроллере, затем добавляю его в ViewData и помещаю это в мой взгляд следующим образом: @Html.Raw(ViewData["Html"]). Мне также интересно, есть ли лучший способ сделать это?

1 Ответ

0 голосов
/ 10 января 2019

Я предполагаю, что выбранные файлы CSS сохраняются через базу данных вашей CMS, и вместо того, чтобы иметь статический список идентификаторов CSS, вы фактически извлекаете информацию из базы данных. В этом сценарии ваша лучшая ставка - компонент просмотра :

public class CustomCssViewComponent : ViewComponent
{
    private readonly MyContext _context;

    public CustomCssViewComponent(MyContext context)
    {
        _context = context;
    }

    public async Task<IViewComponentResult> InvokeAsync()
    {
        var ids = // pull in the ids from your context;
        return View(ids); 
    }
}

Теперь вы просто передаете идентификаторы в качестве модели для представления, поддерживающего этот компонент представления. Итак, создайте это представление на Views/Shared/Components/CustomCss/Default.cshtml:

@model List<int>
<link href="/css/customCss_@(String.Join("_", Model)).css" rel="stylesheet" />

Наконец, в вашем макете или где вы хотите это включено:

@await Component.InvokeAsync("CustomCss")

Промыть и повторить с вашим JS. Вероятно, вы можете обрабатывать свой пользовательский HTML таким же образом, но вы также можете рассмотреть возможность использования помощников пользовательских тегов .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...