Angular 6 - Ожидание загрузки элемента внутри * ngIf при установке для ngIf значения true

Question

Я использую угловой 6.

У меня есть html, подобный приведенному ниже.

<div class="catalog-menus-subnav-wrapper"
                     *ngIf="showMenus">
 <div class="hidden-elem">
 </div>
</div>

Здесь showMenus будет иметь значение по умолчанию false и установить его в true при нажатии кнопкина этой же странице.

Теперь я пытаюсь получить этот div в угловом формате сразу после установки для showMenus значения true и иногда не получаю, так как dom загружен не полностью.

public onClick(event) {

      this.showMenus= true;

      const item= $(event.currentTarget);
      const wrapper = item.next('.catalog-menus-subnav-wrapper');
      const height= item.closest('.hidden-elem').height();

  }

Здесь, item.next ('. catalog-menus-subnav-wrapper') иногда не возвращает значения, поскольку загрузка DOM не выполняется во время выполнения.Есть ли способ ждать загрузки DOM после установки showMenus в значение true?Или есть еще какие-то исправления?

Спасибо

Answer 1

Попробуйте использовать скрытый . Если вы используете ngIf , тогда он удалит элемент из DOM

Попробуйте это ниже,

в .html

<div class="catalog-menus-subnav-wrapper" [hidden]="!showMenus">
   <div class="hidden-elem">
   </div>
</div>