Повторение раздела HTML в Razor Pages - PullRequest
Новая
       62

Повторение раздела HTML в Razor Pages

0 голосов
/ 02 ноября 2019

У меня есть блок HTML, который мне нужно отобразить в нескольких местах на странице, и я ищу способ определить этот HTML только один раз. Я не могу просто положиться на цикл, потому что HTML появляется в разных областях.

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

Я знаю, что могу создать блок @functions, чтобы создать функцию для визуализации разметки, но этоориентирован на код, а не на разметку. Мне бы хотелось что-то более похожее на @helper функции в MVC, но они не доступны в Razor Pages.

Может кто-нибудь предложить другие предложения для определения блока HTML в одном месте, чтобы он могпоказываться где-нибудь на странице?

Ответы [ 2 ]

1 голос
/ 02 ноября 2019

Если вы работаете с .NET Core 3, вы можете включить теги HTML в методы, объявленные в блоке @functions, например, 

@functions{
    void Greeter()
    {
        <h3>Hello World</h3>
    }
}

Затем в части содержимого страницы: 

@{ Greeter(); }

Тип помощника также может принимать параметры: 

void Greeter(string greeting)
{
    <div>@greeting World</div>
}

@{ Greeter("Hello"); }

Если вы работаете с ASP.NET Core 2.x, ваш «вспомогательный» метод - Func<someType, IHtmlString>. В следующем примере someType представляет собой string: 

Func<string, IHtmlContent> Greeter = @<h1>Hello @item</h1>;

Затем в части содержимого страницы: 

@Greeter("World");

someType может быть сложного типа: 

Func<Contact, IHtmlContent> Greeter = @<h1>Hello @item.FirstName</h1>;
0 голосов
/ 02 ноября 2019

Тег шаблона может помочь: 

<template id="block-template">
    <div>
        <p>template contents...</p>
    </div>
</template>

<div id="target1"></div>

<script>
    var tmplt = $("#block-template").html();
    $("#target1").append(tmplt);
</script>

тег template доступен в HTML5, вы также можете использовать шаблон скрипта: 

<script id="block-template" type="text/template">
    <div>
        <p>template contents...</p>
    </div>
</template>

есть много плагинов дляиспользуйте, если вам нужно привязать данные к шаблону:

http://handlebarsjs.com/

https://github.com/jcgregorio/stamp/

https://knockoutjs.com/documentation/template-binding.html

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template

...