Как очистить все выбранные элементы в dropdpwn? - PullRequest
Новая
       4

Как очистить все выбранные элементы в dropdpwn?

1 голос
/ 19 февраля 2020

Мой вопрос связан с Angular и Typescript. Моя проблема довольно сложная. Я создал выпадающее меню с 3 пунктами. Но я не создаю его, используя select тег HTML. Я использую инструментарий моей компании. Это просто оболочка вокруг primeng компонентов с нашим шрифтом и нашей цветовой схемой. Они называют это PLK toolkit. В их коде есть ошибка. Он не очищает ранее выбранный элемент. Вот их пример выпадающего кода (я чувствую, что можно поделиться кодом, потому что это всего лишь несколько строк простого html и написанного мной тоже):

Примечание: В код ниже plk-dropdown похож на тег select, а plk-option похож на тег option. В этом нет ничего особенного. 

<plk-dropdown [(ngModel)]="fruit" name="fruit">
    <plk-option [value]="'apple'">Apple</plk-option>
    <plk-option [value]="'pear'">Pear</plk-option>
    <plk-option [value]="'melon'">Melon</plk-option>
</plk-dropdown>

Итак, когда я нажимаю на него в первый раз, это хорошо. Но после первого щелчка он продолжает выбирать другие параметры наряду с предыдущими. Я посмотрел на их код:

выпадающий. js

DropDownComponent.prototype.writeValue = function (value) {
    if (this.options) {
        this.selectOptionByValue(value);
    }
};

и исправил эту ошибку, добавив 1 строку кода: 

DropDownComponent.prototype.writeValue = function (value) {
  if (this.options) {
      this.clearSelectedOptions(); // THIS I ADDED
      this.selectOptionByValue(value);
  }
};

Теперь компонент работает, но проблема в том, что я не могу внести изменения в их файл js. Во-первых, я не должен этого делать. Во-вторых, если в будущем мы обновим наши репозитории, эта ошибка вернется.

Есть ли способ исправить это с помощью моего машинописного кода. Я не могу реализовать jquery между ними. Я попробовал это:

Как очистить все выбранные элементы на входе SELECT, используя jQuery?

Пожалуйста, помогите мне. Я заблокирован из-за этого. Мне действительно нужна помощь.

1 Ответ

1 голос
/ 20 февраля 2020

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

<plk-dropdown [(ngModel)]="fruit" name="fruit">
    <plk-option [value]="null">Unselected</plk-option>
    <plk-option [value]="'apple'">Apple</plk-option>
    <plk-option [value]="'pear'">Pear</plk-option>
    <plk-option [value]="'melon'">Melon</plk-option>
</plk-dropdown>

demo ?

...