Angular: установите для скрытого значения оператора Select всегда текст

В настоящее время у меня есть раскрывающийся список, который функционирует как нормальное значение, когда вы выбираете оператор, в верхней части раскрывающегося списка (часть, которая отображается, даже если раскрывающийся список не был нажат), показывает последний нажатый символ. Есть ли способ сделать так, чтобы часть раскрывающегося списка всегда говорила слово «Символы», чтобы было очевидно, что делает этот конкретный раскрывающийся список, прежде чем кто-то щелкнет по нему?

Angular: установите для скрытого значения оператора Select всегда текст

Итак, на картинке выше вы можете видеть, что первый вариант выбора является эквивалентом, и, таким образом, он отображается вверху и выделен синим цветом. И если я выберу новый вариант, верхняя часть изменится на это. Но есть ли способ, чтобы верхняя часть всегда могла быть статической фразой, такой как «Символы», независимо от текущего выбранного параметра? Вот мой код:

<select
            id = "symbolInLineSelector"
            (change) = "insertSymbol($event.target.value)"
            class = "ql-size"
            title = "symbolSelect">
            <option
              *ngFor = "let symbol of keys(symbols)"
              [ngValue] = "symbol"
              [innerHtml] = "symbols[symbol]">
            </option>
</select>

Вот мой тс:

insertSymbol(selectedVal) {
    this.editorInstance.insertText(this.previousEditorSelection, selectedVal.value.substring(0, selectedVal.value.length - 15));
    this.editorInstance.setSelection(this.previousEditorSelection.index + selectedVal.value.length + 2);
    this.previousEditorSelection = this.editorInstance.getSelection();
    selectedVal.value = -1;
  }

Вы можете добавить атрибут placeholder, чтобы выбрать тег, например, placeholder = "Symbols"

Niru 14.04.2018 21:09

он не находит заполнитель

FrankTheTank 14.04.2018 21:13

Вы можете поделиться им в плункере

Niru 14.04.2018 21:18
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
3
36
1

Ответы 1

Вы можете добавить статический параметр "символы" и обработать это значение в своей функции изменения.

в ц:

    insertSymbol(select:any){
     //set your value as appropriate: 
        myValue = select.value;
     //set selector to the default -1:
        select.value = -1;
     }

<select
            id = "symbolInLineSelector"
            (change) = "insertSymbol($event.target)"
            class = "ql-size"
            title = "symbolSelect">
<option value = "-1">Symbols</option>
            <option
              *ngFor = "let symbol of keys(symbols)"
              [ngValue] = "symbol"
              [innerHtml] = "symbols[symbol]">
            </option>
</select>

Какой код будет в машинописном тексте, чтобы всегда менять выбранный параметр на символы?

FrankTheTank 14.04.2018 21:04

Передайте event.target вместо event.target.value. После того, как вы вставили соответствующий символ, установите event.target.value = -1.

Farasi78 14.04.2018 21:39

Он по-прежнему обновляет верхнюю часть тем, что я только что нажал.

FrankTheTank 15.04.2018 01:03

Я добавил свой машинописный текст выше, он работает только в том случае, если я поставлю selectedVal.value = -1 в качестве первого вызова в моем методе, и если я сделаю это, ничего не будет вводиться в мой редактор при нажатии

FrankTheTank 15.04.2018 01:12

Вы обновили свой html, чтобы он также имел первый тег option, как в моем примере? У вас по-прежнему есть только тег option с циклом ngFor.

Farasi78 16.04.2018 04:38

Другие вопросы по теме