Angular2: Как правильно вынести ng-bootstrap modal в дочерний компонент?

Question

[Ivan Stroykin]

Доброго времени суток,

не получается в полной мере разобраться с ng2-bootstrap, а именно modal. Если в одном компоненте то всё легко, а если выносить модалку в отдельный компонент (дочерний) то не получается.
Может кто уже проделывал данные манипуляции?

Answer 1

[Ivan Stroykin]

В общем, кому будет нужно или просто интересно. Реализовал.

Допустим selector будет: "test-modal". Тогда там где нужно будет выводить это модальное окно пишем:
<test-modal #testModal></test-modal>
а на button вешаем событие:

<button class="btn btn-primary" (click)="testModal.showTestModal()">Открываем модальное окно</button>

в компоненте модального окна пишем:

@ViewChild('testModal') public testModal: ModalDirective;

public showTestModal(): void {
    this.testModal.show();
}

public hideTestModal(): void {
    this.testModal.hide();
}