1

I'm using AngularFire and have an ng-repeat list with items that contain data specific to the "author" of that item (multiple users can add to the list), such as name, location, etc. I'm not writing that data into the array being iterated over by ng-repeat since it could change in the future. Instead, that author-specific data is store in a different location so the goal is that if the author changes their information, all of it is reflected in the list.

For a contrived example, imagine I'm iterating over a list of books from different authors. That list will contain the book-specific data (such as title, publish date, etc.) but I will also want to display the author's information in the list. Instead of including the author's information directly within the book data, I want to simply reference that author ID, and pull in whatever data is in their profile so if they change their name, it'll reflect the changes in all of their book listings.

That means I'm left to make async calls to Firebase to retrieve that information for each list item via a template function, such as {{getAuthorName(authorId)}}. The only problem is that they're async calls and the template function evaluates before the data is available.

I've looked into how to accomplish but have yet to find a solution that accommodates what I need. The answers here seem close, but they appear to no longer work in Angular >= 1.2.0 and they don't account for having to return different data for each template function call.

Update

Here is a JSFiddle with what I have now. I've made some progress, but all that's being returned now is the promise object as expected. I'm not sure how to implement .then in this scenario to get the actual value.

Any help would be great.

Community
  • 1
  • 1
scferg5
  • 2,003
  • 5
  • 22
  • 28

1 Answers1

2

You can make use of $firebaseObject and then store that in an object to make sure it doesn't get hit again. like so:

var authors = {};

$scope.getAuthorName = function(authorId){
    if(!authors[authorId]){
        var authorRef = new Firebase(fburl + "/authors/" + authorId);            
         authors[authorId] = $firebaseObject(authorRef);
    }
    return authors[authorId];
};

You can see the working fiddle here: http://jsfiddle.net/0rcdpq47/

Mathew Berg
  • 28,625
  • 11
  • 69
  • 90
  • Yep. See also the userCache service is [this fiddle](http://jsfiddle.net/katowulf/vspo65qm/) – Kato May 29 '15 at 19:16
  • Thanks both of you! @Kato I see your normalizing script hasn't been updated for AngularFire 1.x so I've gone through and made the necessary changes to make it compatible (from what I can see), but the original post list is being returned instead of the postData + userData. Ideas? I'm afraid I'm still missing something that needs to changed for AngularFire 1.x. – scferg5 May 30 '15 at 18:57
  • The userCache service would require changing exactly one line of code $firebase(ref).$asObject() to $firebaseObject(ref). – Kato Jun 01 '15 at 05:29
  • @Kato I'm afraid that's not correct, unless I'm not understanding something. Making the change you mentioned on line 66 of the fiddle still results in a few errors: `FirebaseArray.$extendFactory` is not a function on line 13 (guessing it needs to be `$firebaseArray.$extend`?) and `$firebase(ref).$asArray()` needs to be changed to `$firebaseArray(ref)` on line 25. Still after those additional changes (what ends up being the fiddle I linked to), I don't get the merged data. – scferg5 Jun 04 '15 at 01:07