这是创建数据表的父组件：

import {CollectedItemsDynamic} from "../collected-items-datatable/collected-items-dynamicView";
    declare var $: any;

    @Component({
      selector: 'sa-datatable-roi',
      template: `<table class="dataTable {{tableClass}}" width="{{width}}">
            <ng-content></ng-content>
          </table>`,          
    })
    export class DatatableComponent implements OnInit {

      @ViewChild(CollectedItemsDynamic) collectedItemsDynamic: CollectedItemsDynamic;

      ngOnInit() {
        this.render()    
      }

      render() {
        let element = $(this.el.nativeElement.children[0]);
        let options = this.options

        const _dataTable = element.DataTable(options);


          element.on('click', 'td.details-control', function () {
            var tr = $(this).closest('tr');
            var row = _dataTable.row( tr );
            if ( row.child.isShown() ) {
              row.child.hide();
              tr.removeClass('shown');
            }
            else {
              row.child( -----> Inject_here_the_CollectedItemsDynamic_template <----- ).show();
              tr.addClass('shown');
            }
          })
        }
    }

这是动态组件：

import {Component, Input, ElementRef, AfterContentInit, OnInit} from '@angular/core';

declare var $: any;


    @Component({
        selector: 'collected-items-dynamic',
        templateUrl: `
                 <td><button (click)="test()"></button></br></br></td>               
    `,
    })

    export class CollectedItemsDynamic{

        public test() {
            console.log(test);
        }
    }

我想在行之后使用 row.child( -----> Inject_here_the_CollectedItemsDynamic_template <-----).show(); 注入CollectedItemsDynamic组件的html模板

这应该在选定的行之后添加一个，并且按钮单击应该打印到控制台==在CollectedItemsDynamic中绑定应该工作 .

有没有办法将CollectedItemsDynamic注入到DatatableComponent的DOM中？

angular typescript dynamic angular2-template viewchild