Вставьте строку в элемент Blazor/HTML, если нет свойства ключ=значение.

мне нужно построить<select>список с необязательным выбранным элементом. В настоящее время мне приходится писать две версии в зависимости от того,selectedсвойство моего элемента словаря истинно.

      <InputSelect>
    @foreach (var kvp in ListOfValues)
    {
    if (kvp.Key == SelectedValue)
      {
        <option selected value="@kvp.Key">@kvp.Value</option>
      }
      else
      {
        <option value="@kvp.Key">@kvp.Value</option>
      }
    }
</InputSelect>

Однако я надеялся сократить этот процесс, потому что если потребуются дополнительные атрибуты (например, илиclassэто становится до смешного сложным. Просматривая руководства, я предполагал, что это может сработать, но это не так...

      <InputSelect>
    @foreach (var kvp in ListOfValues)
    {
        <option @(kvp.Key == SelectedValue ? "selected" : "") value="@kvp.Key">
            @kvp.Value
        </option>
    }
</InputSelect>

Есть ли способ добавить строки в элементы HTML, если нет комбинации свойство=значение?

Дальнейшая ясность

Я могу успешно пропустить условную проверку и просто использовать<InputSelect @bind-Value="@SelectedValue">, но этот вопрос также относится к таким аспектам, какdisabledкоторые обычно не отображаются с помощью=value.

1 ответ

Если вы хотите визуализировать атрибут через

      @(kvp.Key == SelectedValue ? "selected" : "")

Он сообщит об ошибке:

      Failed to execute 'setAttribute' on 'Element': '@(kvp.Key' is not a valid attribute name.

Атрибуты элемента HTML условно отображаются на основе значения .NET. Если значение false или null, атрибут не отображается. Если значение истинно, атрибут отображается в свернутом виде. Итак, если вы хотите сократить первый процесс, вы можете использовать этот метод для рендерингаselectedатрибут по условию.

      @foreach (var kvp in ListOfValues)
        {
            <option value="@kvp.Key" selected="@(kvp.Key==SelectedValue)">
                @kvp.Value
            </option>
        }
Другие вопросы по тегам