Question

我试图了解表组件在PrimeNG中的工作方式。我对父组件的实例如何传递到子组件的构造函数感到困惑。

这里是TableBody组件的来源，其中包含Table组件的一个实例。 PrimeNG Table Source

所以我的理解是TableBody组件具有一个属性作为选择器。它从父（表）组件的列和bodyTemplate中传递。现在我不明白的是创建父组件（表）的实例时如何将其传递给它。

表格组件模板的片段

            <div class="ui-table-wrapper" *ngIf="!scrollable">
            <table #table [ngClass]="tableStyleClass" [ngStyle]="tableStyle">
                <ng-container *ngTemplateOutlet="colGroupTemplate; context {$implicit: columns}"></ng-container>
                <thead class="ui-table-thead">
                    <ng-container *ngTemplateOutlet="headerTemplate; context: {$implicit: columns}"></ng-container>
                </thead>
                <tfoot *ngIf="footerTemplate" class="ui-table-tfoot">
                    <ng-container *ngTemplateOutlet="footerTemplate; context {$implicit: columns}"></ng-container>
                </tfoot>
                <tbody class="ui-table-tbody" [pTableBody]="columns" [pTableBodyTemplate]="bodyTemplate"></tbody>
            </table>
        </div>

完整来源：Github source

任何见识都将不胜感激。

Answer 1

父组件中的[pTableBody]和[pTableBodyTemplate]属性已在ts文件中声明了@Input。并且“列”绑定到具有相同名称的变量。

阅读一些有关输入和输出https://www.sitepoint.com/angular-2-components-inputs-outputs/的信息

希望我有所帮助。

父组件的实例如何传递到子组件的构造函数中？

1 个答案: