отключить все кнопки и ссылки в div - PullRequest
Новая
       35

отключить все кнопки и ссылки в div

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

Я пытаюсь отключить все события нажатия внутри div. Я отключил весь div, но это не решение для меня, потому что у меня есть события mouseEnter, мне нужно продолжать работать.

Проблема в том, что это директива, которую я использую в разных частях моего приложения, поэтому этот div имеет различные структуры, и иногда кнопка является "прямым потомком", иногда она находится на втором уровне.

Это моя попытка, она работает, но я нашел ее "грязной": 

<div #mydirective>
  <button (click)="function1()">button</button>
  <div>
    <a (click)="function2()">link</a>
  </div>
</div>

//directive ts
var children = this.element.nativeElement.children;
for (let child of children) {
  this.renderer.setAttribute(child, 'disabled', 'true'); //for button
  this.renderer.addClass(child, 'disabled'); //for links
  var grandchildren = child.children;
  for (let grandchild of grandchildren) {         
    this.renderer.setAttribute(grandchild, 'disabled', 'true');
    this.renderer.addClass(grandchild, 'disabled');
  }
}

Я уверен, что это должно быть проще, есть ли способ найти все кнопки и ссылки в моем div?

1 Ответ

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

Если вы хотите отключить все щелчки мышью. Затем условно добавьте класс CSS к этому div, чтобы отключить все события указателя.

В html файле. 

<div class="your-class">
  // buttons and content goes here.
</div>

в файле css / scss. 

.your-class {
  pointer-events: none;
}
...