Question

我希望我的页面显示2个标签，每个标签都包含一个表格。由于表的结构相同，我为表创建了一个自定义组件，并将其用作子组件。父页面：

 <p-tabPanel>
    <cutomComp #table1 [items]=>"variable1"</customComp>
</<p-tabPanel>
<p-tabPanel>
    <cutomComp #table2 [items]="variable2"></customComp>
</<p-tabPanel>

我的自定义组件：

    <p-dataTable [value]="itemsForTable">
</p-dataTable>

ngOnChanges(changes: SimpleChanges){
    //init itemsForTable from items
}

问题是只有在更改了variable1时才更新表（仅调用ngOnChanges），而不是在更改variable2时更新表。为什么？此外，当对variable1执行ngOnChanges时，也会更新table2。那么问题是什么？我希望每张桌子都是独立的，我怎样才能实现呢？

提前致谢。

Answer 1

问题1：

<cutomComp #table1 **[items]=>"variable1"**</customComp>

这里应该是[items] =＆＃34; variable1＆＃34;。

问题2：

如果错误地输入以上内容，则输入错误。正如您在此处使用primeng选项卡显示两个表一样，使用一个布尔值来显示/隐藏基于选项卡单击的数据表。这段代码不会导致任何问题。

<p-tabPanel>
    <cutomComp #table1 *ngIf="showTable1" [items]="variable1"</customComp>
</<p-tabPanel>
<p-tabPanel>
    <cutomComp #table2 *ngIf="showTable2" [items]="variable2"></customComp>
</<p-tabPanel>

Angular2：在父级中使用两个相同的子组件

1 个答案: