添加新项目时数组重复

Question

我有一个使用 firebase 作为后端的 Ionic2 应用程序。在 Ionic 应用程序中，我有一个产品页面，当我在控制面板中添加新产品并将其推送到 firebase 时，如果我在 ionic 应用程序中查看产品页面，则会添加新产品，但列表中的所有项目也是重复的。

如果我在用户当前正在查看产品列表时添加新项目，他们会看到整个列表重复，但如果您离开该屏幕并再次访问它，列表将恢复正常，每个列表都有一个项目。

这是我在我的 ionic 应用程序中使用的代码，用于从 firebase 中提取产品。

  public menuItems: Array<any> = [];
  public selectedItems: Array<any> = [];
  menuItem: FirebaseListObservable<any>;

---

this.id = this.navParams.get('id');
      this.menuItem = af.database.list('/menuItems', {
        query: {
          orderByChild: 'category',
          equalTo: this.id
        }
      })

      this.menuItem.subscribe((data) => {
        this.menuItems = data;

        for (var i = 0; i <= this.menuItems.length - 1; i++) {
          if (this.menuItems[i].category == this.id) {
            this.selectedItems.push(this.menuItems[i]);
            this.items = this.selectedItems;
          }
        }
      })

一个例子：

如果我有这样的项目列表：

• 项目1
• 项目2
• 项目3

当我从仪表板添加新项目并推送到 firebase 时，离子应用程序现在将显示以下内容：

• 项目1
• 项目2
• 项目3
• 项目4
• 项目1
• 项目2
• 项目3
• 项目4

我不确定它为什么会这样做，任何帮助将不胜感激。

Answer 1

很简单。你必须做一些调整。

改变这个：

    for (var i = 0; i <= this.menuItems.length - 1; i++) {
      if (this.menuItems[i].category == this.id) {
        this.selectedItems.push(this.menuItems[i]);
        this.items = this.selectedItems;
      }
    }

进入：

        let selectedItems: any[] = [];
        for (var i = 0; i <= this.menuItems.length - 1; i++) {
          if (this.menuItems[i].category == this.id) {
            selectedItems.push(this.menuItems[i]);
          }
        }
        this.items = selectedItems;