Reference.push 失败：第一个参数包含未定义的属性

Question

我正在尝试将两个数据（itemName 和 itemAmout）发送到 firebase 数据库，但它给了我以下错误：

错误：Reference.push 失败：第一个参数在属性“shoppingItem.itemName”中包含未定义

我不知道问题出在哪里。

我尝试使用此解决方案 Error: Reference.push failed ，但它只会带走错误消息而不会将数据发送到我的 firebase 数据库。 这是我的代码：

addItem.ts ：

import { Component } from '@angular/core';
    import { IonicPage, NavController, NavParams } from 'ionic-angular';
    import {ShoppingItems} from '../../models/items.interface';
    import { AngularFireDatabase } from   'angularfire2/database';

    import { AngularFireList } from 'angularfire2/database'; 

    @IonicPage(

      {
        segment :'shoppingList/Add-Item'
      }
    )
    @Component({
      selector: 'page-add-item',
      templateUrl: 'add-item.html',
    })
    export class AddItemPage {

    shoppingItem ={} as ShoppingItems ;
    shoppingListRef$ :AngularFireList<ShoppingItems>;


      constructor(public navCtrl: NavController, public navParams: NavParams,
         private adb:AngularFireDatabase) {

          this.shoppingListRef$=adb.list('/shoppingItem');

      }

      addItem(shoppingItem:ShoppingItems){
        this.shoppingListRef$.push({

          itemName: this.shoppingItem.itemName ,
          itemAmount : Number(this.shoppingItem.itemAmount)  

        });

        //this.shoppingItem={} as ShoppingItems;
        this.navCtrl.pop();

      }

    }

*items.interface.ts : *

export interface ShoppingItems {
    itemName : string ;
    itemAmount : number;

}

addItem.html:

<ion-header>

  <ion-navbar color="dark">
    <ion-title>Add Item</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>
<ion-item>
  <ion-label floating>
    item  name
  </ion-label>
  <ion-input type="text" ([ngModel])="shoppingItem.itemName"></ion-input>
</ion-item>

<ion-item>
    <ion-label floating>
      item  amount
    </ion-label>
    <ion-input type="number" ([ngModel])="shoppingItem.itemAmount"></ion-input>
  </ion-item>

<button ion-button block (click)="addItem(shoppingItem)">Add item</button>
</ion-content>

Answer 1

我花了很长时间才发现您的问题。它来自 ngmodel。它的 [()] 不是 ([])

<ion-item>
  <ion-label floating>
    item  name
  </ion-label>
  <ion-input type="text" [(ngModel)]="shoppingItem.itemName"></ion-input>
</ion-item>

<ion-item>
    <ion-label floating>
      item  amount
    </ion-label>
    <ion-input type="number" [(ngModel)]="shoppingItem.itemAmount"></ion-input>
  </ion-item>