listview - NativeScript Angular 2 Firebase 列表不起作用

Question

尝试获取包含我的 firebase 数据库内容的最新列表。

不知何故它不起作用，我正在使用 eddy verbruggen 的 firebase 插件。该插件正在运行，但我无法将其显示在列表中。

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>

火力数据库:

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

Answer 1

当我在我自己的程序中使用您的fbGetData() 函数时，它起作用了。我不确定您对 firebase 有多陌生，但我首先要检查的是在数据库下的 firebase 控制台中有一个规则选项卡。在这里你必须输入读写规则。您可以找到文档 at this firebase link .这些规则有一个层次结构。所以理解它们很重要。这很容易成为阻止您的代码的原因。

测试它的一种方法是将您的规则设置为以下内容:

{
  "rules": {
    "user0": {
      ".read": true,
      ".write": true
    }
  }
}

这将为您的“user0”节点提供读写访问权限。您不想在开发中使用此代码，因为任何人都可以读取或覆盖您的数据。

要访问根节点，只需像这样将您的读写规则添加到根节点即可。

{
  "rules": {
    ".read": true,
    ".write": true
  }
}

如果不是因为这个原因，请告诉我。