AngularFire:如何过滤同步数组? [英] AngularFire: How to filter a synchronized array?

查看:19
本文介绍了AngularFire:如何过滤同步数组?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

考虑一组项目和用户.每个用户可以拥有一个或多个项目.项目集可以很大,但每个用户通常只有少量项目.

应用程序:项目:第 1 项:名称:'表'白颜色'createdAt: '2014-08-09T12:54:58.803Z'项目2:名称:'macbook air'颜色:'银色'createdAt: '2014-06-09T12:54:58.803Z'第 3 项:名称:'Firebase T 恤'颜色:'黄色'createdAt: '2014-07-09T12:54:58.803Z'用户:用户 1:项目:第 1 项:真实第 3 项:真实用户 2:项目:项目 2:真实

给定一个用户 ID,例如user1,我想显示用户的项目列表,按 createdAt 排序:

黄色火力T恤白桌

Firebase 服务器上的每个更新都应反映在应用视图中.

我想视图应该是这样的:

{{ item.color }} {{ item.name }}

但是,我想不出一个简单的方法来设置 $scope.items.

这就是我目前所做的:

var userItemsRef = new Firebase(FIREBASE_ROOT + '/users/user1/items');$scope.userItems = $firebase(userItemsRef).$asArray();$scope.userItems.$loaded(function() {$scope.userItems.$watch(setItems);设置项();});函数 setItems() {var promises = $scope.userItems.map(function(userItem) {var itemRef = new Firebase(FIREBASE_ROOT + '/items/' + userItem.$id);返回 $firebase(itemRef).$asObject().$loaded();});$q.all(promises).then(function(items) {$scope.items = 物品;});}

这是利用 AngularFire 的最佳方式吗?

解决方案

按用户存储项目可能是最简单的.所以一个这样的结构:

/app/items/$user_id/$item_id/...

这将允许像这样检索属于特定用户的项目:

var userId = 'user1';var ref = new Firebase(FIREBASE_ROOT + '/items/' + userId);$scope.items = $firebase(ref).$asArray();

如果这是不可能的,因为项目在用户之间共享,使用 join 可能是最简单的库.

var userId = 'user1';var userIndexRef = new Firebase(FIREBASE_ROOT + '/users/' + userId + '/items');var itemsRef = new Firebase(FIREBASE_ROOT + '/items/');var ref = Firebase.util.intersection(userIndexRef, itemsRef);$scope.items = $firebase(ref).$asArray();

但一般来说,走第一条路线是最安全和最简单的.

Consider a set of items and users. Each user can have one or more items. The set of items can be quite big, but every user will normally have small amount of items.

app:
  items:
    item1:
      name: 'table'
      color: 'white'
      createdAt: '2014-08-09T12:54:58.803Z'
    item2:
      name: 'macbook air'
      color: 'silver'
      createdAt: '2014-06-09T12:54:58.803Z'
    item3:
      name: 'firebase t-shirt'
      color: 'yellow'
      createdAt: '2014-07-09T12:54:58.803Z'
  users:
    user1:
      items:
        item1: true
        item3: true
    user2:
      items:
        item2: true

Given a user id, e.g. user1, I would like to display a list of user's items, sorted by createdAt:

yellow firebase t-shirt
white table

Every update on the Firebase server should be reflected in the app view.

I guess the view should look like this:

<div ng-repeat="item in items | orderBy:'createdAt'">
  {{ item.color }} {{ item.name }}
</div>

But, I can't figure out an easy way to set up $scope.items.

This is what I currently do:

var userItemsRef = new Firebase(FIREBASE_ROOT + '/users/user1/items');
$scope.userItems = $firebase(userItemsRef).$asArray();

$scope.userItems.$loaded(function() {
  $scope.userItems.$watch(setItems);
  setItems();
});

function setItems() {
  var promises = $scope.userItems.map(function(userItem) {
    var itemRef = new Firebase(FIREBASE_ROOT + '/items/' + userItem.$id);

    return $firebase(itemRef).$asObject().$loaded();
  });

  $q.all(promises).then(function(items) {
    $scope.items = items;
  });
}

Is this the best way to utilize AngularFire?

解决方案

It would probably be simplest to store the items by user. So a structure like this:

/app/items/$user_id/$item_id/...

This would allow for the items belonging to a particular user to be retrieved like so:

var userId = 'user1';
var ref = new Firebase(FIREBASE_ROOT + '/items/' + userId);
$scope.items = $firebase(ref).$asArray();

If this isn't possible, because items are shared between users, it's probably simplest to use a join lib.

var userId = 'user1';
var userIndexRef = new Firebase(FIREBASE_ROOT + '/users/' + userId + '/items');
var itemsRef = new Firebase(FIREBASE_ROOT + '/items/');
var ref = Firebase.util.intersection(userIndexRef, itemsRef);
$scope.items = $firebase(ref).$asArray();

But generally, it's safest and simplest to take the first route.

这篇关于AngularFire:如何过滤同步数组?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆