从组件角度2获取ng-template

时间:2017-05-16 07:26:13

标签: angular2-template angular2-directives ng-bootstrap

我如何获得角度2中的元素? 如果我在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>

我将它用于ngBmodal ng-bootstrap 如果我使用按钮打开内容,它的工作=按钮

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

然后我想从组件中打开内容 在这种情况下,我从其他页面和开放内容重定向

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' });
  }

模态打开,但没有html,我尝试afterviewinit得到#content它不起作用 谢谢,对不起我的英文:v

1 个答案:

答案 0 :(得分:0)

首先导入NgbModal和ModalDismissReadons并将modalservice添加到构造函数中,请参见:

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

然后在您的打字稿文件中:

1-导入TemplateRef和ViewChild,例如:

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

2-创建绑定ngtemplate的变量(在构造函数之前添加):

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

3-从打字稿中打开模式:

this.modalService.open(this.content);