NativeScript Angular 2 Firebase列表不起作用

试图获取最新的Firebase数据库内容列表。NativeScript Angular 2 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

来源

2016-10-11 Sam van beastlo

当我用你的fbGetData()功能在我自己的程序它的工作原理。我不确定您对firebase有多新，但我要检查的第一件事是在Firebase控制台下的数据库中有一个规则选项卡。在这里你必须输入读写规则。你可以找到文件at this firebase link。这些规则有一个层次结构。所以理解它们很重要。这很容易成为阻碍你的代码的东西。

的方式来测试它是你的规则设置如下：

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

这会给读写访问你的“用户0”的节点。您不想在开发中使用此代码，而任何人都可以读取或写入您的数据。

用于访问根节点只需将您的读写规则添加到根节点，如下所示。

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

如果不是因为这个原因让我知道。

来源

2016-12-13 10:26:09 DauvO

NativeScript Angular 2 Firebase列表不起作用

回答

相关问题