How can I get a single record from AngularFire collection synchronized from Firebase

问题

I am having trouble getting a single record from an AngularFire synchronized array.

This is my service:

app.factory("Projects", ["$firebaseArray", function($firebaseArray) {
    // create a reference to the Firebase where we will store our data
    var ref = new Firebase("https://XXXXXXXXXX.firebaseio.com");
    var childRef = ref.child('projects');
    var projects = $firebaseArray(childRef);

    return {
        all: projects,

        create: function (projects) {
            return projects.$add(project);
        },
        get: function (projectId) {
            console.log(projectId);
            projects.$loaded().then(function(x) {
                var project = x.$getRecord(projectId);
                console.log(project); // This print null
            }).catch(function(error) {
                console.log("Error:", error);
            });
        },
        delete: function (project) {
            return projects.$remove(project);
        }
    };
  }
]);

This is my controller:

app.controller('ProjectViewCtrl', function ($scope, $routeParams, Projects, Auth) {
    $scope.project = Projects.get($routeParams.projectId);
});

This is my view:

<div>
 <p>{{project.creatorUID}}</p>
 <p>Project ID: {{project.$id}}</p>
</div>

<a class="btn button" ng-href="#!/">Back to Dashboard</a>

I can pull up the detail project as far as the routing but I am not able to see any content or data.

回答1:

Semantically speaking, this service creates an API that returns the same methods already available on $firebaseArray. There's really no need for this service at all as it provides no additional functionality and does not abstract any complexity. It could easily be reduced to:

app.factory("Projects", function($firebaseArray) {
    // create a reference to the Firebase where we will store our data
    var ref = new Firebase("https://XXXXXXXXXX.firebaseio.com").child('projects');
    return $firebaseArray(ref);
});

Since the methods already call $add, $delete, et al internally, those can be used by the callee in place of the wrapping methods.

Moving on to the question about finding a specific record by key, this can be done using the $getRecord method on the array. Most likely, however, this isn't what you're looking for. You haven't provided the use case here, which is pretty limiting for how well we can address your intended design (see XY problem), but your code suggests you just want one record and not the array. This should be done using $firebaseObject rather than trying to synchronize a list and then extract a single item from the list:

app.factory('Record', function($firebaseObject) {
   var baseRef = new Firebase('...').child('projects');
   return function(recordId) {
      return $firebaseObject(baseRef.child(recordId));
   }
});

Now one can simply fetch the synchronized object representing any record like so:

app.controller('...', function(Record) {
   var rec = Record( 'foobar123' );
});

Another common use case is creating a list where you click an item, and then edit the contents for that specific item, and save them back to Firebase (i.e. some sort of editable grid/list view). That can already be done without any unnatural and duplicate synchronization of content already in the array:

<ul>
  <li ng-repeat="rec in list">
     {{rec.$id}}: {{rec.name}}
     <button ng-click="pickItem(rec)">select</button>
  </li>
</ul>

<form ng-show="selectedRec">
  <input ng-model="selectedRec.field" 
         ng-change="list.$save(selectedRec)" />
</form>

And the controller:

$scope.list = $firebaseArray(...);
$scope.pickItem = function(rec) {
  $scope.selectedRec = rec;
};

来源：https://stackoverflow.com/questions/29309537/how-can-i-get-a-single-record-from-angularfire-collection-synchronized-from-fire

标签

firebase

angularfire