在Angular中使用Nativescript 5.0
该应用程序正在使用tabview结构。 每个选项卡视图都使用组件来显示数据。
定期(例如每30秒一次)更新标签页的最佳方法是什么?
组件正在调用api以获取实时数据。最初在启动App时,我在相应组件的ngOnInit()上调用api,因此选项卡中填充了数据。
如何定期从何处调用这些API?
这是我的TabView html文件,如下所示:
<TabView id="tabViewContainer">
<StackLayout *tabItem="{title: 'Batches'}">
<StackLayout>
<ns-batches></ns-batches>
</StackLayout>
</StackLayout>
<StackLayout *tabItem="{title: 'Courses'}">
<StackLayout>
<ns-courselist></ns-courselist>
</StackLayout>
</StackLayout>
<StackLayout *tabItem="{title: 'Post'}">
<StackLayout>
<ns-postlist></ns-postlist>
</StackLayout>
</StackLayout>
<StackLayout *tabItem="{title: 'Sales'}">
<StackLayout>
<ns-sales></ns-sales>
</StackLayout>
</StackLayout>
</TabView>
答案 0 :(得分:0)
在Tabview中添加selectedIndexChanged事件并更新活动Tab的数据
<TabView id="tabViewContainer" (selectedIndexChanged)="onSelectedIndexChanged($event)">
<StackLayout *tabItem="{title: 'Batches'}">
<StackLayout>
<ns-batches (dataYouwanttoUpdate)="updatedInTabViewTs"></ns-batches>
和在您的firsTabItem.ts中
import { Input } from '@angular/core';
@Input()
dataYouwanttoUpdate:ObservableArray
和您的.ts
onSelectedIndexChanged(args: SelectedIndexChangedEventData) {
const tabView = <TabView>args.object;
const selectedTabViewItem = tabView.items[args.newIndex];
switch (args.newIndex) {
case 0:
//update the ns-batches data.
this.updateData()
...
default:
break;
}
}
interval:数字;
updateData(){
this.interval = setInterval(() => {
this.getdata.getData().subscribe( data => {
this.batches = data.batches ;
});
},500);
}