如何将数据数组对象保存到离子 SQlite 存储（TypeScript、Angular 5、Ionic 3）答案

【问题标题】：How to save a data array object to ionic SQlite storage (TypeScript, Angular 5, Ionic 3)如何将数据数组对象保存到离子 SQlite 存储（TypeScript、Angular 5、Ionic 3）
【发布时间】：2018-10-02 08:07:55
【问题描述】：

我正在尝试使用 Ionic SQlite 存储将具有许多属性的数据数组对象保存到收藏列表。

例如，我在数据提供者中有一个数据数组：

data.ts

     private options: any[] = [

        {
          "name": "option 01",
          "website": "www.google.com",
          "about": "choose this option 01",
          "id": "1"
        },

        {
          "name": "option 02",
          "website": "www.yahoo.com",
          "about": "choose this option 02",
          "id": "2"
        },
        {
          "name": "option 03",
          "website": "www.bing.com",
          "about": "choose this option 03",
          "id": "3"
        },
        {
          "name": "option 04",
          "website": "www.stackoverflow.com",
          "about": "choose this option 04",
          "id": "4"
        }
    ]

我在我的 home html 页面中调用这些数据对象，该页面具有保存到收藏列表的选项。

<ion-card *ngFor="let option of options">
  <h1>{{option.name}}</h1>
  <h1>{{option.about }}</h1>
<h4>{{option.website}}</h4>

<button ion-button block (click)="saveToFavorite()">Save to Favorite List</button>

<button ion-button block (click)="removeFromFavorite()">Remove from Favorite List</button>
</ion-card>

这是不完整的 home.ts 文件

import { Storage } from '@ionic/storage';

const STORAGE_KEY = 'favoriteOptions';

  saveToFavorite(option) {

    this.storage.set();
  }

  removeFromFavorite(option) {
   this.storage.remove();
  }

我希望 saveToFavorite() 将选项数据数组对象保存到收藏选项存储键，以便我可以将它们全部加载到 favoriteList HTML 页面上：

<ion-content>
    <div *ngFor="let option of options">
        <h1>{{option.name}}</h1>
        <p>{{option.about}}</p>
        <button ion-button block (click)="removeFromFavorite()">Remove from Favorite List</button>
    </div>
</ion-content>

favoriteList ts 文件：

  getAllFavoriteOptions() {
    return this.storage.get(STORAGE_KEY);
  }

  removeFromFavorite(option) {
   this.storage.remove();
  }

不知怎的，我有点迷路了。请更正我在 ts 文件上的代码。

提前致谢！

【问题讨论】：

也用于删除。
谢谢，我想知道如何将多个数据数组对象保存到 sqlite 存储中。我可以设法只保存一个，但是每当我尝试保存其他对象时，它都会覆盖前一个。

标签： angular ionic-framework ionic2 ionic3 angular5

【解决方案1】：

制作一个保存收藏夹的函数：

addFavorite(favorite:any):void{
  let favorites = this.storage.get('favorites');
  if(favorites){
    favorites.push(favorite);
    this.storage.set('favorites', favorites);
  }else{
    favorites = [];
    favorites.push(favorite);
    this.storage.set('favorites',favorites);
  }

然后要获得收藏夹添加此功能：

getFavorites():any{
  let favorites = this.storage.get("favorites");
  return favorites;
}

for ionic：如果您使用的是@ionic/storage，那么加载项目使用async pipe：

getFavorites():Promise<any>{
  let favorites = this.storage.get("favorites");
  return favorites;
}

然后在 *ngFor 中访问它们：

<div *ngFor="let item of getFavorites() | async">
      <div>{{item.name}}</div>
</div>

【讨论】：