Как использовать свойство атрибутов в HtmlTargetElement (вспомогательные функции тегов) для таргетинга на тот или иной тег?

Я борюсь с пониманием того, как показать, что строка, назначенная Attributes в атрибуте класса HtmlTargetElement, работает. У меня есть пара вопросов, которые, я думаю, подчеркнут мою проблему и понимание.

Допустим, мы хотим активировать элемент Html только тогда, когда make начинается с gm и есть какая-либо модель. Я думаю, что есть способ сделать это с помощью одного атрибута класса (а не нескольких).

Я пытаюсь сделать следующее, но это просто SWAG и не работает. Я был бы признателен за советы, чтобы я мог понять, что означает документ, когда он говорит, что этот атрибут может принимать «селектор запроса, такой как строка».

Вспомогательный класс тега

[HtmlTargetElement("auto-price", Attributes = "[make^=gm][model]")]
public class AutoPriceTagHelper : TagHelper
{

и разметка бритвы

<auto-price make="gm" model="volt" ></auto-price>
<auto-price make="ford" model="mustang"></auto-price>
<auto-price make="ford" ></auto-price>
<auto-price test></auto-price>

c# asp.net-core asp.net-core-mvc asp.net-core-tag-helpers
person Peter Kellner    schedule 18.03.2017    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Это действительно работает так, как вы ожидали. Единственный недостаток, который вам не хватает, - это то, что Attributes представляет собой список атрибутов, разделенных запятыми, поэтому при указании более одного вам нужны запятые, как в Attributes = "[make^=gm],[model]".

Итак, следующая макетная версия вашего помощника:

[HtmlTargetElement("auto-price", Attributes = "[make^=gm],[model]")]
public class AutoPriceTagHelper : TagHelper
{
    public string Make { get; set; }
    public string Model { get; set; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        output.TagName = "ul";
        output.Content.SetHtmlContent(
$@"<li>Make: {Make}</li>
<li>Model: {Model}</li>");
    }
}

Со следующей разметкой для бритвы:

<auto-price make="gm" model="volt" ></auto-price>
<auto-price make="ford" model="mustang"></auto-price>
<auto-price make="gmfoo" model="the foo"></auto-price>
<auto-price make="gmbar"></auto-price>
<auto-price test></auto-price>

Соответствует только первому и третьему появлению, поскольку они единственные с обоими обязательными атрибутами (make и model) и соответствующими условию префикса ^gm для атрибута make.

В результате html выглядит так:

<ul><li>Make: gm</li>
<li>Model: volt</li></ul>
<auto-price make="ford" model="mustang"></auto-price>
<ul><li>Make: gmfoo</li>
<li>Model: the foo</li></ul>
<auto-price make="gmbar"></auto-price>
<auto-price test=""></auto-price>
person Daniel J.G.    schedule 19.03.2017
comment
Спасибо @DanielJG. Я также понимаю, что QuerySelected Like ограничен только startwith, endwith, equalto. Я отправил аналогичный вопрос с селекторами css, когда здесь нет ответа. stackoverflow.com/questions/42879348/ - person Peter Kellner; 19.03.2017
comment
Я не могу найти подходящую документацию по этому поводу, но смотрю на источник, похоже, ограничен этим использованием - person Daniel J.G.; 19.03.2017
comment
- person Daniel J.G.; 19.03.2017