Get ng-template from component angular 2

Question

how can i get the element in angular 2? in case i have this in html

<ng-template #content let-c="close" let-d="dismiss">
  <div class="modal-header">Header</div>
   <div class="modal-body">Body</div>
  <div class="modal-footer">footer</div>
</ng-template>

i use that for ngBmodal ng-bootstrap if i use button for open content its work = button

(click)="open(content,data.id)"

then i would like open content from component in this case, im redirect from other page and open content

ngOnInit() {
    this.activatedRoute.queryParams.subscribe((params: Params) => {
        let id = params['id'];
        if(id != undefined){
          this.open('content',id);         
        }
      });
  }
open(content, id) {
    this.dataModal = {};
    this.getDataModal(id);

    this.mr = this.modalService.open(content, { size: 'lg' });
  }

modal open but not with the html, i try afterviewinit to get #content it doesnt work thanks,sorry for my english :v

alansastre alansastre · Accepted Answer · 2018-07-22T09:47:22

First import NgbModal and ModalDismissReasons

import { NgbModal, ModalDismissReasons } from '@ng-bootstrap/ng-bootstrap';

and add modalservice to constructor

private modalService: NgbModal

See:

https://ng-bootstrap.github.io/#/components/modal/examples#options

Then in your typescript file:

1 - Import TemplateRef and ViewChild, example:

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

2 - Create the variable that binds the ngtemplate (add before constructor):

@ViewChild('content')
private content: TemplateRef<any>;

3 - Open modal from typescript:

this.modalService.open(this.content);

Get ng-template from component angular 2

1 Answers