离子 2 & Angularfire2 + Firebase答案

【问题标题】：Ionic 2 & Angularfire2 + Firebase离子 2 & Angularfire2 + Firebase
【发布时间】：2016-12-07 03:39:17
【问题描述】：

我在 Ionic 2 中使用 AngularFire2 作为提供程序。我正在制作一个基本的列表应用程序。以下是我在 Firebase 中的数据。

{
  "Checklists" : {
    "0" : {
      "title" : "new List"
    },
    "-KYHODAYcQ4OKMAzcXSG" : {
      "items" : [ {
        "checked" : "false",
        "title" : "Milk"
      } ],
      "title" : "Newest List"
    },
    "-KYHS654NUHiwkexMwhL" : {
      "items" : [ {
        "checked" : "false",
        "title" : "asdfadf"
      } ],
      "title" : "ddddd"
    }
  }
}

我的主页视图中的所有内容都很好，并且可以毫无问题地更新每个清单的标题。我通过在我的数据提供程序类中使用此代码检索数据，然后在我的home.ts 中调用它。顺便说一句，这很好用。

this.checklists = angFire.database.list('/Checklists');

当我导航到应用程序中的新视图时，问题就出现了。因此，我使用此代码移动到清单项目视图并传递当前清单。

this.checklist = this.navParams.get('checklist');

所以现在，在清单项目视图中，如果清单有标题和项目，我会引用当前清单以及标题和项目。如果我已经在 Firebase 中安装了它们，那就可以了。

问题是如何将一个项目或项目数组添加到其中一个清单中，如果它在 Firebase 中不存在。我现在可以在视图中做到这一点，这样做没有问题，

if(this.checklist.items && this.checklist.items.length > 0){
    this.checklist.items.push({title: data.name, checked:"false"});
}else{
    this.checklist.items = [{title: data.name, checked:"false"}];
    console.log(this.checklist);
}

当我想将它更新到 Firebase 时，我遇到了问题。通过在我的数据提供程序中执行此操作，我可以让它使用初始项目数组更新一个清单。

this.checklists.update(id, {items: [
        {
            title: itemTitle,
            checked: "false"
        }
    ]});

但这会覆盖已经存在的任何内容。

我需要获取对当前清单的引用并查看是否有 items 数组，但我找不到任何文档。我已经尝试过参考，但这不起作用。任何帮助都会很棒。谢谢。

【问题讨论】：

标签： firebase firebase-realtime-database ionic2 angularfire2

【解决方案1】：

所以我最终让它工作，但不确定这是否是正确的方法。在 checklist-items 视图中，我通过这样做将项目添加到当前 checklist.items 数组中

**this is the checklist-items view**
if(this.checklist.items && this.checklist.items.length > 0){
    this.checklist.items.push({title: data.name, checked:"false"});
}else{
    this.checklist.items = [{title: data.name, checked:"false"}];
    console.log(this.checklist);
}

然后我调用函数在我的数据提供者类中添加和项目，并将包含整个项目数组的整个清单发送给它。

this.data.addItem(this.checklist);

然后在我的数据提供程序中，我只需在我的数据提供程序类中执行此操作，即可覆盖当前清单中的整个项目数组。

**this is the data-provider view**
addItem(checklist):void {
    let checklistId = checklist.$key;

    this.checklists.update(checklistId, {items: checklist.items});
}

这可行，但就像我说的那样，不知道这是否正确。

【讨论】：

【解决方案2】：

我建议不要使用数组来存储数据。数组存储为以整数作为键名的对象。这些整数不可靠，因为它们不是永久密钥。如果数组中的一个项目被删除，你提交整个数组，这些项目将有一个新的整数键。

建议的数据结构：

 checklist
    -key
        items
            -itemKey
                name: "milk"
                checked: true
            -itemKey
                name: "bread"
                checked: false      
            -itemKey
                name: "sugar"
                checked: true           
        title: "newest list"

【讨论】：