ngx-datatable -行在选项卡集中没有正确呈现。

Question

我有一个角组件(国家组件)和3个子组件作为Tab(州，人口，工业)。父组件有一个下拉列表，例如“Country List”，它控制将显示在选项卡中的数据。在“加载”中，“国家列表”下拉列表中不会选择任何内容，“状态”选项卡将使用0行int状态列表加载。

我使用@泳道/作为状态列表表。

当我选择一个国家(例如:印度)时，将填充国家列表表(29行)。到目前为止一切都很好。

当我移动到另一个选项卡(人口或工业)，并更改国家(有10个州)，然后转到国家表，只有一行(第一行)显示在状态列表表中。

页脚显示两种情况下的精确计数。

为什么会发生这种事？有什么问题吗？

父组件：

​

<tabset>
	<tab heading="States">
		<app-states>
		</app-states>
	</tab>
	<tab heading="Population">
		<app-Population>
		</app-Population>
	</tab>
	<tab heading="Industries">
		<app-Industries>
		</app-Industries>
	</tab>
</tabset>

​

表格布局：

​

Answer 1

可以使用布尔参数来处理此问题，如下所示：

MyComponent.ts

    export class MyComponent implements OnInit{
        IsDataReady:boolean
        mydata=[];

        constructor(private _myService:myService){
            this.IsDataReady=false;
        }

        ngOnInit() {
            this.LoadData();    
        }

        LoadData(){
            this.IsDataReady=false;
            //Get data from service
            this._myService.getData().subscribe(data=>{
                this.mydata=data;
                this.IsDataReady=true;
            }
        }
    }

在*ngIf中添加布尔变量，如下所示

MyComponent.html

    <ngx-datatable #data class="material" *ngIf="IsDataReady">
    </ngx-datatable>