Hello helpers, I am pushing data into Firebase but I am having this error. What have I missed out or done wrong?
Earlier I am able to push data into it but not on this page.
Much appreciation.
I would like to push this value into Firebase for later retriever.
Error message
ERROR Error: Firebase.push failed: first argument contains undefined in property 'all-item.anArray'.
My html code
<ion-content>
<ion-item>
<ion-label>Number of item</ion-label>
<ion-input type="number" [(ngModel)]="item" ></ion-input>
</ion-item>
<button ion-button (click)="Add(item)">Create Field</button>
<button ion-button (click)="delete(item)">Remove Field</button>
<ion-item *ngFor="let att of anArray; let idx = index">
<ion-label color="primary" floating>{{att.label}}{{idx+1}}</ion-label>
<ion-input type="text" [(ngModel)]="anArray[idx].value"></ion-input>
</ion-item>
My ts code
export class HomePage {
anArray: any = [];
item: any;
btn: any
data: any;
allItem = {} as allItem;
allItemRef$: FirebaseListObservable<allItem[]>
constructor(public navCtrl: NavController, public navParams: NavParams, private database: AngularFireDatabase) {
this.allItemRef$ = this.database.list('all-item');
console.log('this.anArray', this.anArray);
this.btn = false;
this.data = false;
}
Add(key) {
console.log('key', key)
for (let i = 0; i < key; i++) {
this.anArray.push({ label: 'item', value: '' });
}
console.log('show current', this.anArray);
this.btn = true;
}
delete(key) {
console.log('key', key)
for (let i = 0; i < key; i++) {
this.anArray.pop({ label: 'item', value: '' });
}
console.log('show current', this.anArray);
this.btn = true;
}
submit(allItem: allItem) {
this.allItemRef$.push({
anArray: this.allItem.anArray,
});
this.allItem = {} as allItem;
this.navCtrl.push('NextPage');
}
My model class
export interface allItem {
anArray: string;
}
Thank you for all help.