添加新项

Question

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

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

这是我在离子应用程序中使用的代码，用于从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;
          }
        }
      })

一个例子：

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

• ITEM1
• ITEM2
• 项目3

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

• ITEM1
• ITEM2
• 项目3
• ITEM4
• ITEM1
• ITEM2
• 项目3
• ITEM4

我不确定为什么会这样做，任何帮助都会非常感激。

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;