Question

我收到以下错误：

Firebase参考集失败：第一个参数包含以下内容中的未定义属性“ items.LX ....名称

我搜索并针对此错误找到了其他答案，但它们似乎对我没有帮助e.g this。

这是我的代码.ts：

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, AlertController } from 'ionic-angular';
import * as firebase from 'firebase';
import { snapshotToArray, FIREBASE_CONFIG } from '../../app/app.firebase.config';

@IonicPage()
@Component({
  selector: 'page-profile',
  templateUrl: 'profile.html',
})
export class ProfilePage {
  items = [];
  inputFoodText: string;
  ref = firebase.database().ref('items/');
  constructor(public navCtrl: NavController, public navParams: NavParams, private alertCtrl: AlertController) {

    this.ref.on('value', resp =>{
      this.items = snapshotToArray(resp);
    });
  }

  addItem(item){
    if(item!==undefined && item!==null){
      let newItem = this.ref.push();
      newItem.set(item);
      this.inputFoodText = '';
    }
  }

  async deleteItem(key){
    firebase.database().ref('items/'+key).remove();
  } 

  editItem(key){
    let alert = this.alertCtrl.create({
      title: 'Edit item',
      inputs: [
        {
          name: 'name',
          placeholder: 'Name'
        }
      ],
      buttons: [
        {
          text: 'Cancel',
          role: 'cancel'
        },
        {
          text: 'Edit',
          handler: data => {
            if(data.name!==undefined && data.name.length>0){
              firebase.database().ref('items/'+key).update({name:data.name})
            }
          }
        }
      ]
    });
    alert.present();
  }
}

它连接到以下html：

 <ion-row>
   <ion-input [(ngModel)]="inputFoodText" placeholder="Item name"></ion-input>
   <button ion-button full (click)="addItem({name: InputFoodText})">Add</button>
   <ion-list>
     <ion-item *ngFor="let item of items" (click)="editItem(item.key)">
      {{item.name}}
     </ion-item>
   </ion-list>

  </ion-row>
</ion-content>

如果有帮助，请查看以下app.module.ts导入代码段：

imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    AngularFireModule.initializeApp(FIREBASE_CONFIG), AngularFireAuthModule, AngularFireDatabaseModule, FormsModule
  ],

firebase配置文件为：

export const FIREBASE_CONFIG =  {
    api......
  };

export const snapshotToArray = snapshot =>{
  let returnArray = [];
  snapshot.forEach(element =>{
    let item = element.val();
    item.key = element.key;
    returnArray.push(item);
  });
  return returnArray;
}

请有人提供帮助（我正在将Angular Ionic与Firebase实时数据库配合使用）。

谢谢

Answer 1

正确答案是弗兰克：

如果在addItem（{name：InputFoodText}）中看起来像InputFoodText是未定义。我希望这是因为该字段本身被称为 [（ngModel）] =“ inputFoodText”，以小写i开头。确保这个案例到处都是。 –弗兰克·范普菲伦

Firebase参考集失败：第一个参数包含以下内容中的未定义

1 个答案: