我要同步firebase table和ionic list。
这些是数据库
中的项Items
-KQpA9YpXyqBQ2HZedEo
name: "jhj"
-KQpAWtIaMeS93431BRQ
name: "hj"
-KQpB6grRt15GnacKHjW
name: "j"
离子部分
<ion-list>
<ion-item ng-repeat="item in items">
<h2>{{item.name}}</h2>
</ion-item>
</ion-list>
这是我的firebase部分
var itemsRef = firebase.database().ref('Items');
//first try
var items = itemsRef.orderByChild('name');
$scope.items = items;
//this is second try
itemsRef.on('child_added', function (data) {
$scope.items = data.val();
});
如果我尝试这样做,我可以在控制台上看到Items。
var items = itemsRef.orderByChild('name');
items.on('child_added', function (snapshot) {
var obj = snapshot.val();
console.log(obj);
});
我需要帮助来获取和显示离子上的列表。
使用$firebaseArray是解决方案
var itemsRef = firebase.database().ref('Items');
var itemsQuery = itemsRef.orderByChild('name');
$scope.items = $firebaseArray(itemsQuery);
Angular Fire Docs
我认为使用$firebaseObject更好。
查看
var itemsRef = firebase.database().ref('Items');
var items = itemsRef.orderByChild('name');
$scope.items = $firebaseObject(items); // Don't forget to add $firebaseObject in your dependencies of your controller
现在可以在视图中执行以下操作
<ion-list>
<ion-item ng-repeat="(key, item) in items">
<h2>{{item.name}}</h2>
</ion-item>
</ion-list>
您还可以通过编写{{key}}
来使用键,如果您需要导航到它的详细信息页面,这很有用。通过使用它,您可以获得所有子事件(添加,更改和删除)