Как внедрить из родительского компонента дочернее представление в DOM, используя @ViewChild из кода ts с таблицами данных

Это родительский компонент, который создает таблицу данных:

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

Я хотел бы ввести html-шаблон компонента CollectedItemsDynamic после строки, используя row.child( -----> Inject_here_the_CollectedItemsDynamic_template <-----).show();

Это должно добавить после выбранной строки, и нажатие кнопки должно вывести на консоль == привязка в CollectedItemsDynamic должна работать.

Есть ли способ внедрить в DOM DatatableComponent CollectedItemsDynamic?


person USer22999299    schedule 16.02.2017    source источник
comment
Мне кажется, вы скорее хотите что-то вроде ngForTemplate или ngTempletOutlet stackoverflow.com/questions/41239733/, stackoverflow.com/questions/37676593 /   -  person Günter Zöchbauer    schedule 16.02.2017
comment
@GünterZöchbauer GünterZöchbauer Я должен использовать его таким образом, потому что я использую datatable.min.js, который не полностью перенесен в angular2, потому что я должен попытаться добавить шаблон компонента, используя row.child(...).show()   -  person USer22999299    schedule 16.02.2017
comment
Не знаю, возможно ли это.   -  person Günter Zöchbauer    schedule 16.02.2017