Пользовательский TagHelper

Я создал специальный помощник по тегам, который настраивается с новым тегом на странице, то есть user-view

Я использую этот Tag Helper следующим образом

<user-view user-view-mode="Sidebar"></user-view>

и хотел бы, чтобы этот помощник тега создал структуру html, подобную следующей

<div class="user-view">
   [...]
</div>

Однако, глядя на сгенерированный код, я обнаружил

<user-view>
    <div class="user-view">
        [...]
    </div>
</user-view>

Должен ли я использовать output.SetContent() вместо output.Content.AppendHtml()?

Кроме того, параметр user-view-mode относится к типу enum. Есть ли способ получить предложения / подсказки в html о доступных значениях?

Последний вопрос: как мне получить доступ к текущему подключенному пользователю в моем коде TagHelper?


person Lorenzo    schedule 15.03.2017    source источник


Ответы (1)


Насколько мне известно, метод SetContent() также работает с внутренней частью элемента. Способ создания TagHelpers, который вводит новые теги, - это замена тега во время обработки. В вашем случае это будет примерно так:

[HtmlTargetElement("user-view")]
public class UserViewTagHelper : TagHelper
{
    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        // Replace user-view with div
        output.TagName = "div";

        // Set class
        output.Attributes.SetAttribute("class", "user-view");

        // Append the inner structure
        output.Content.AppendHtml(...);
    }
}

Что касается вопроса о доступе к текущему подключенному пользователю, я предлагаю вам использовать DI. Вы можете внедрить любую службу (ранее зарегистрированную с помощью IServiceCollection) с помощью стандартной инъекции конструктора. Дополнительность ViewContext и ViewComponentContext может быть добавлена ​​в свойства благодаря специальным атрибутам.

public class UserViewTagHelper : TagHelper
{

    [ViewContext]
    public ViewContext ViewContext { get; set; }

    [ViewComponentContext]
    public ViewComponentContext ViewComponentContext { get; set;
}

На их основе вы сможете получить своего пользователя.

person tpeczek    schedule 15.03.2017
comment
Большой. Ваше решение отлично работает в отношении вопроса о теге. Есть ли у вас какие-либо предложения по последним вопросам в посте? - person Lorenzo; 15.03.2017
comment
@Lorenzo Извините, я просто пропустил эту часть вопроса. Я добавил подробную информацию о том, как использовать DI с TagHelpers, что должно дать вам то, что вам нужно. Вы также можете найти более подробную информацию о создании TagHelper здесь - person tpeczek; 15.03.2017
comment
Большой! Большое спасибо! - person Lorenzo; 15.03.2017