Angular 4 + primeng: передать HTML-контент от одного компонента другому

Я хочу добавить некоторые функции разбиения на страницы на стороне сервера в элемент данных primeng (p-datatable) в нескольких местах, поэтому я объявил новый компонент "pagin-datatable.component" с нужными мне функциями и поведением.

Итак, pagin-datatable.component.html (template) поставляется с:

<p-dataTable [value]="value" 
  resizableColumns="true" 
  scrollable="true" 
  scrollWidth="100%" 
  [(rows)]="this.gridOptions.rows" 
  [paginator]="true" 
  [lazy]="true" 
  [totalRecords]="nbTotal" 
  (onFilter)="filtrage($event)"
  (onPage)="pagination($event)" 
  (onSort)="tri($event)" 
  [rowsPerPageOptions]="rowsPerPageOptions" >
  /* There should be the p-columns */
</p-dataTable>

Я хочу, чтобы мои p-столбцы все еще были объявлены в моем main.component.html как:

<pagin-datatable [value]="partenaires" (pagin)="refresh($event)" [rowsPerPageOptions]="[5,10,20,40]">
        <p-column sortable="true" [filter]="true" field="aField"     header="A HEADER"></p-column>
        /* And so it goes for every other p-columns */
 </pagin-datatable>

Мой вопрос заключается в следующем: как сказать моему pagin-компоненту, чтобы p-datatable обрабатывал содержимое, отправленное в теги компонента?

После ответа ниже:

Нашел эту статью, чтобы исправить проблему primeng: github.com/primefaces/primeng/issues/1215.

1 ответ

Решение

Вы можете использовать в pagin-datatable.component.html вот так

    <p-dataTable [value]="value" 
  resizableColumns="true" 
  scrollable="true" 
  scrollWidth="100%" 
  [(rows)]="this.gridOptions.rows" 
  [paginator]="true" 
  [lazy]="true" 
  [totalRecords]="nbTotal" 
  (onFilter)="filtrage($event)"
  (onPage)="pagination($event)" 
  (onSort)="tri($event)" 
  [rowsPerPageOptions]="rowsPerPageOptions" >
  /* There should be the p-columns */
  <ng-content></ng-content>
</p-dataTable>

и в вашем main.component.html вы можете деформировать столбец в pagin-datatable, как вы хотите.

Другие вопросы по тегам