Слушатель Angular 5 или директива для изменения свойства кнопки отключена - PullRequest
Новая
       17

Слушатель Angular 5 или директива для изменения свойства кнопки отключена

0 голосов
/ 17 мая 2018

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

       <button id="btn1" #button1 [disabled]="checkIfIsDisable()" nextActivekBtn>
        Ändern
      </button>
      <button #button2 type="button"  [disabled]="checkIfIsDisable()">
        Text1
       </button>
      <button #button3 type="button"  [disabled]="checkIfIsDisable()">
        Text1
       </button>
      <button #button4 type="button"  [disabled]="checkIfIsDisable()">
        Text1
       </button>
      <button #button5 type="button"  [disabled]="checkIfIsDisable()">
        Text1
       </button>

Моя идея заключалась в том, чтобы иметь директиву (например, nextActiveBtn), которая будет прослушивать свойство кнопки (отключено), а затем вызывать функцию родительского компонента, которая будет определять, на какую кнопку или элемент фокусироваться.Также мне интересно, могу ли я использовать ViewChildren на этих кнопках?Давайте предположим, что у меня есть много кнопок в HTML, но я хочу иметь их подмножество (есть только эти 5 кнопок).Я установил свойство disabled в функции, но мне очень нравится иметь директиву или что-то независимое от этой функции.

Спасибо за любой совет или новую идею.

1 Ответ

0 голосов
/ 21 мая 2018

Директива не была хорошей альтернативой для этого.Лучшим решением было создать функцию в компоненте, которая управляет текущей кнопкой фокуса.Также я добавляю #navigableButton к каждой кнопке и создаю список, содержащий каждую из них.

@ ViewChildren ('navigateButton') navigableButtons: QueryList <ElementRef>;

Благодаря этому я мог легко найти следующую активную кнопку в цикле и перейти к ней.Функция управления фокусом текущей кнопки вызывается после функции, которая отключила кнопку.

...