从组件角度 2 获取 ng-template答案

【问题标题】：Get ng-template from component angular 2从组件角度 2 获取 ng-template
【发布时间】：2017-10-15 03:40:57
【问题描述】：

如何获得角度 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

【问题讨论】：

你找到解决方案了吗？

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

【解决方案1】：

首先导入 NgbModal 和 ModalDismissReasons

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

并将模态服务添加到构造函数

private modalService: NgbModal

见：

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

【讨论】：