• 1
Votes
name
name Punditsdkoslkdosdkoskdo

NativeScript Angular 2 Firebase list is not working

Trying to get a list up to date with the content of my firebase database.

Somehow it does not work, i'm using the firebase plugin from eddy verbruggen. The plugin is working but i can't get it displayed on the list.

home.component.ts

import { Component, ElementRef, OnInit, ViewChild } from "@angular/core";
import firebase = require("nativescript-plugin-firebase");

@Component({
  selector: "home",
  templateUrl: "pages/home/home.component.html"
})
export class HomeComponent implements OnInit {

  meting: Array<Object> = [];

  ngOnInit() {
    this.fbGetData();
  }

  public onItemTap(args) {
        console.log("------------------------ ItemTapped: " + args.index);
    }

  fbGetData(){
  var onChildEvent = (result) => {
   console.log("Value: " + JSON.stringify(result.value));  // <-- works
    this.meting.unshift(result.value);
  };  
  // listen to changes in the /users path
  firebase.addChildEventListener(onChildEvent, "/user0").then(
    (listenerWrapper) => {
      var path = listenerWrapper.path;
      var listeners = listenerWrapper.listeners; // an Array of listeners added
      // you can store the wrapper somewhere to later call 'removeEventListeners'
  }
  );
  }  
}

home.component.html

    <ListView [items]="meting" (itemTap)="onItemTap($event)">
    <template let-item="item" let-i="index" let-odd="odd" let-even="even">
        <StackLayout [class.odd]="odd" [class.even]="even">
            <Label [text]='"Week: " + i'></Label>
            <Label [text]='"Gewicht: " + item.gewicht + ", Middel: " + item.middel + ", Heup: " + item.heup'></Label>
        </StackLayout>
    </template>
</ListView>

firebase database:

user0
    week0
        gewicht: 86
        heup: 78
        middel: 78
    week1
        gewicht: 85
        heup: 76
        middel: 74