Angular 如何在不刷新页面的情况下自动更新离子列表上的数据
我创建了一个包含离子列表的页面,有两个按钮,如果单击该按钮,它将调用firebase api并得到更新。更新后,整个列表将刷新。如何停止刷新整个列表Angular 如何在不刷新页面的情况下自动更新离子列表上的数据,angular,ionic-framework,ionic4,Angular,Ionic Framework,Ionic4,我创建了一个包含离子列表的页面,有两个按钮,如果单击该按钮,它将调用firebase api并得到更新。更新后,整个列表将刷新。如何停止刷新整个列表 我知道你已经满意地解决了这个问题,但你确实在这里发现了一些东西 只需将新数据推送到模型,您将看到它更新,但在引擎盖下,它正在重新创建整个列表 如果数据变长,那么这可能会给您带来性能问题。此时,您应该查看trackBy 这是一种为Angular提供跟踪列表中每个单独项目的方法,这样当涉及到更新时,Angular可以确定哪些项目实际上需要更新,并且只
我知道你已经满意地解决了这个问题,但你确实在这里发现了一些东西 只需将新数据推送到模型,您将看到它更新,但在引擎盖下,它正在重新创建整个列表 如果数据变长,那么这可能会给您带来性能问题。此时,您应该查看
trackBy
这是一种为Angular提供跟踪列表中每个单独项目的方法,这样当涉及到更新时,Angular可以确定哪些项目实际上需要更新,并且只需要更改它们
这看起来像是一个问题。您是在替换现有模型还是在推动它?似乎我正在替换。现有模型然后请尝试将新数据推送到模型。希望它能解决问题。是的,它能解决问题。非常感谢。它正在工作。
onLocationDataUpdate() {
// Get current location
this.geolocation.getCurrentPosition().then(position => {
this.location.lat = position.coords.latitude;
this.location.lng = position.coords.longitude;
// Get location data from Firebase
this.connectivityServiceService.getLocations(
this.locatingRange,
this.location.lat,
this.location.lng
);
// Bind data to Ionic list
this.dataSetSubscription = this.connectivityServiceService.geoPointLocationUpdateNotify.subscribe(
locations => {
const locationData = this.connectivityServiceService.getGeoPointLocations();
if (locationData.length > this.maxDataCount) {
const tempLocationData = locationData.slice(0, this.maxDataCount);
tempLocationData.forEach(item => {
if (item.feed_back === undefined) {
item = Object.assign(item, {
feed_back: { count: 0, positive: [], negative: [] }
});
}
});
this.geoPointLocationData = tempLocationData;
this.loader.dismiss();
} else {
const tempLocationData = locationData;
tempLocationData.forEach(item => {
if (item.feed_back === undefined) {
item = Object.assign(item, {
feed_back: { count: 0, positive: [], negative: [] }
});
}
});
this.geoPointLocationData = tempLocationData;
this.loader.dismiss();
}
}
);
});
}