web-dev-qa-db-ja.com

ng-bootstrapモーダルをプログラムで開く

Ng-bootstrapモーダルを含むangular 4ページがあります。私のコードは次のようになります。

foo.html

[...]
<button class="btn btn-sm btn-secondary material-icons"
(click)="open(content)">search</button>

<ng-template #content let-c="close" let-d="dismiss">
    content in here
</ng-template>
[...]

foo.ts

[...]
constructor(private modalService: NgbModal) { }
[...]
open(content) {
   let options: NgbModalOptions = {
     size: 'lg'
   };

   this.modalService.open(content, options);
}
[...]

ボタンをクリックすると、モーダルが開きます。ここでやりたいことは、ngChangesでモデルを開くことです。

ngOnChanges(changes: any) {
   open(content)
}

私の問題は、ここで「コンテンツ」を取得するにはどうすればよいですか？ ng-templateをプログラムで取得する方法はありますか？前もって感謝します！

angularmodal-dialogng-bootstrapng-template
13
Christian Riese

クラス内のcontent要素にアクセスするには、次を宣言します。

@ViewChild('content') private content;

そして、クラスの最上部に対応するインポートを追加します。

import { ViewChild } from '@angular/core';

最後に、変更検出機能でその要素のopenメソッドを呼び出します。

ngOnChanges(changes: any) {
   this.open(this.content);
}
26
Vega