2016-09-01 3 views
2

나는 this 비디오를 팔로우하고 있습니다. 하지만 그것을 구현하는 데 어려움이 있습니다. 이것은 HTML 파일입니다.AngularFire가 Firebase 데이터베이스의 데이터를 표시하지 않습니다.

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Welcome to Firebase Hosting</title>   
     <!-- AngularJS --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 

     <!-- AngularFire --> 
     <script src="https://cdn.firebase.com/libs/angularfire/2.0.2/angularfire.min.js"></script> 

     <!-- Firebase --> 
     <script src="https://www.gstatic.com/firebasejs/3.3.0/firebase.js"></script>   

     <script src="app.js"></script> 
    </head> 
    <body ng-app="app"> 
    <div id="message" ng-controller="MyController as ctrl"> 
     <pre> 
{{ ctrl.object | json }} 
      </pre> 
    </div> 
    </body> 
</html> 

내 app.js 파일은 다음과 같습니다.

(function(){ 

     // Initialize Firebase 
     var config = { 
       apiKey: "SOME KEY", 
       authDomain: "tier2list.firebaseapp.com", 
       databaseURL: "https://tier2list.firebaseio.com", 
       storageBucket: "", 
     }; 
     firebase.initializeApp(config); 

     angular.module('app', ['firebase']).controller('MyController', function($firebaseObject){ 
       const rootRef = firebase.database().ref().child('tier2list'); 
       const ref = rootRef.child('object'); 
       this.object = $firebaseObject(ref); 
     }); 

}()); 

이것은 내 데이터베이스 구조입니다. enter image description here

하지만 결과는 다음과 같습니다.

enter image description here

뿐만 아니라 콘솔에 오류가 없다. 데이터베이스 규칙은 다음과 같습니다.

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

당신이 당신의 데이터베이스가 어떻게 생겼는지 우리를 보여줄 수 :

은 또한 사람이 문제가 자신을 위해 그것을 만드는 데 경우에 프로젝트의 Github에서의 환매 특약을 만들어? 데이터베이스에 '객체'자식이 없을 수도 있으므로 null을 반환하는 것이 좋습니다. 아무 것도 영향을 미치지 않아야하는 마지막 일은 좋지 않다는 것은 설정에서 저장소 버킷이 비어 있다는 것입니다. 그것은 알려진 화재 기지의 버그입니다. 돌아가서 config를 다시 가져 가면 표시됩니다. –

+0

데이터베이스 구조가 추가되었습니다. – Isuru

+0

스크립트 순서가 올바르지 않습니다. Firebase는 AngularFire 이전에 설치해야합니다. https://github.com/firebase/angularfire#downloading-angularfire – cartant

답변

2

문제는 동기화 경로에 : 당신이 빈 개체를 얻을 수 있도록

const rootRef = firebase.database().ref().child('tier2list'); 

는 데이터베이스의 자식 tier2list 없습니다. 프랭크가 대답 할 때 나는이의 중간에 있었다

const rootRef = firebase.database().ref() 
+0

아, 그랬습니다. 당신은 @ 프랭크를 흔들어. – Isuru

1

:

대신하여 당신이 할 수있는 전체 데이터베이스를 동기화하기 위해 노력하고 있습니다. 그는 정답이 있지만, 여기에 데이터베이스가 다윗의 코드를 작동하려면 어떻게 보일지이다 : 그것은 조금 복잡 할 수 있도록를 통해 자신의 거리에서 enter image description here

, 그는 이미 angular 노드의 내부 . https://github.com/LukeSchlangen/angularFireQuickDemo

관련 문제