Как мне открыть BsModel при загрузке страницы в Angular 8 - PullRequest
0 голосов
/ 19 апреля 2020

Я пытаюсь открыть мою BsModel при загрузке страницы в моем Angular 8 проекте. Я много пробовал. Но, не могу открыть мою модель. Вот мой код:

HTML:

<ng-template #showPrivacyPop>
   <div class="modal-header">
       <h4 class="modal-title pull-left">Create Pluck User</h4>
       <button type="button" class="close pull-right" aria-label="Close" (click)="modalRef.hide()">
           <span aria-hidden="true">&times;</span>
       </button>
   </div>
   <div class="modal-body">
       jhgjhg
   </div>
</ng-template>

И мой файл TS:

import { Component, OnInit, ViewChild, TemplateRef, ElementRef, ViewRef } from '@angular/core';
import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';


@Component({
  selector: 'app-filemanager',
  templateUrl: './filemanager.component.html'

})
export class FilemanagerComponent implements OnInit {

  @ViewChild('showPrivacyPop') public privacyPopup: TemplateRef<any>;

  modalRef: BsModalRef;
  config = {
    animated: true
  };


  constructor(private modalService: BsModalService) {

  }

  ngOnInit() {
    console.log(this.privacyPopup);
  }

  openModal(template: TemplateRef<any>) {
    console.log(template);
    this.modalRef = this.modalService.show(template, this.config);
  }

}

Я не знаю, как мне вызвать HTML для отображения при загрузке страницы. Кто-нибудь, пожалуйста, решите мою проблему.

1 Ответ

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

Вы можете сбросить OnInit метод. privacyPopup будет доступно только на крюке AfterViewInit. Если это все еще доставляет вам проблемы, вы можете поместить его в setTimeout с задержкой 0, просто чтобы бросить его в конец строки в очереди событий l oop.

Кроме того, в angular 8, @ViewChild требуется дополнительный аргумент ({static: boolean}). В Angular 9 это необязательно, так как по умолчанию static: false. По сути, он сообщает среде выполнения, чтобы выполнить запрос после (static: false) или до (static: true) первого цикла обнаружения изменений. Обычно вы хотите, чтобы оно было false, если только запрос не имеет какой-либо зависимости, которая будет разрешена только после запуска обнаружения изменений.

export class FilemanagerComponent implements AfterViewInit {

@ViewChild('showPrivacyPop', {static: false}) 
public privacyPopup: TemplateRef<any>;

...

ngAfterViewInit() {
  this.openModal(this.privacyPopup);
}
...