Reference.push失败:第一个参数包含属性中的undefined

时间:2018-02-28 15:11:56

标签: javascript angular firebase ionic-framework ionic3

我正在尝试将两个数据(itemName和itemAmout)发送到firebase数据库但是它给了我以下错误:

  

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

我不知道问题的来源。

我尝试使用此解决方案[SO]: Python struct.pack() behavior (@CristiFati's answer),但它只会在不将数据发送到我的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>

1 个答案:

答案 0 :(得分:2)

我永远带我去发现你的问题。它来自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>