离子 - 从本地存储中删除对象
问题描述:
我目前正在为本人的Ionic应用程序使用本地存储。我可以从本地存储中添加和获取数据,但是当我尝试删除特定对象时,我的数据库中的所有内容都将被删除。当我尝试在我的(现在是空的)数据库中添加一个新对象时,我收到错误消息: “运行时错误 - 无法读取未定义的属性”推送“离子 - 从本地存储中删除对象
应用程序用户场景是,最喜欢的电视节目到收藏夹列表中,如果想要的话,从那里可以不满意。
这是我在我的服务代码,其保持功能的localStorage的:
export class FavoritesService{
constructor(private storage: Storage){}
public favoritesSeries: any = [];
addSeriesToFavorites(serie: any)
{
this.favoritesSeries.push(serie);
console.log('Add to');
console.log(this.favoritesSeries);
this.storage.set('FavSerie',this.favoritesSeries);
}
getFavoriteSeries(){
this.favoritesSeries = [];
this.storage.get('FavSerie').then((val) => {
console.log(val);
if (val){
this.favoritesSeries = val;
}});
}
removeFavoriteSeries(){
this.storage.remove('FavSerie').then((val)=>{
this.favoritesSeries = val
console.log('serie is removed');
});
}
saveChanges(favoriteSeries: any) {
this.favoritesSeries = favoriteSeries;
this.storage.set('favoriteSeries', this.favoritesSeries);
}
}
我的收藏页:
export class Favorites {
series: {};
constructor(public navCtrl: NavController,
public navParams: NavParams,
public seriesService: SeriesService,
public alertCtrl: AlertController,
public favoritesService: FavoritesService) {
}
ionViewDidLoad() {
//presents the favorite series
this.series = this.favoritesService.favoritesSeries;
console.log(this.favoritesService.favoritesSeries);
console.log(this.series);
}
onRemoveFromFavorites(FavSerie: any){
const alert = this.alertCtrl.create({
title: 'Remove From Favorites',
subTitle: 'Are you sure?',
message: 'Are you sure you want to remove from favorites?',
buttons: [
{
text: 'Yes',
handler:() => {
console.log('OK');
console.log(FavSerie);
this.favoritesService.removeFavoriteSeries();
console.log('efter service addToFavorite');
}
},
{
text: 'No',
role: 'cancel',
handler:() => {
console.log('Cancel');
}
}
]
});
alert.present();
}
}
答
您正在使用这样的数据:
- 编辑
favoritesSeries
- 保存
favoritesSeries
存储为FavSerie
这是正常的,但你的方法removeFavoriteSeries
的工作原理是这样的:
- 删除
FavSerie
(这是你的系列阵列)从DB - 将
favoritesSeries
到任何由返回的承诺解决storage.remove
要修复您的代码,您可以编辑您的代码removeFavoriteSeries
这样:
removeFavoriteSeries(serie: any){
this.favoritesSeries = this.favoritesSeries.filter(s => s !== serie);
this.saveChanges(this.favoritesSeries);
}
这样做是:
- 编辑的
favoritesSeries
列表包含所有系列 - 保存(现改为)
favoritesSeries
到存储
这与编辑系列列表的其他代码一致。
现在,当您拨打removeFavoriteSeries
方法并为其指定要删除的serie
时,它将删除它。
在旁注中,您应该考虑为您的系列对象设置固定类型。如果favoritesSeries
是固定类型的数组,您可能会在编译时看到此错误。
编辑:
现在,你应该在你的Favorites
类编辑onRemoveFromFavorites
:
相反this.favoritesService.removeFavoriteSeries();
的应该是this.favoritesService.removeFavoriteSeries(FavSerie);
。
有了这个,你传递给你想要删除的系列FavoritesService
。
另外,你应该修改你的addSeriesToFavorites
这样的:
addSeriesToFavorites(serie: any)
{
this.favoritesSeries.push(serie);
console.log('Add to');
console.log(this.favoritesSeries);
this.saveChanges(this.favoritesSeries); // <- use the saving method
}
这几乎工作!当我按下“Unfavorite”时,它会在我的数据库中保存一组新的favoriteSeries。但是,如果我在浏览器中刷新页面,我仍然可以看到列表中的所有系列文件。 另外,我的favorites.ts文件在我的原始文章中无法显示。删除系列的方法是红色,并说:“提供的参数不匹配调用目标的任何签名”。为什么我不应该发送我的FavSerie阵列? –
您应该编辑'onRemoveFromFavorites'。我在答案中添加了使用示例。 –
更靠近一步!它仍然会删除我列表中的所有内容,即使我只是在一个系列中按“不合适”。但至少我在添加新系列时遇到的问题已经解决,我不再有同样的错误。这是我的数据库现在的样子:https://imgur.com/a/7N1YP –