Use angularFire conjuction with pure firebase js - firebase

Question

I am confuse about why we have to use angularFireCollection built-in methods such as add() update() remove() etc instead of using firebase js api directly.
Since we just want to bind the firebase node with angularJS. We can just use
angularFireCollection(nodeRef) then if we want to do something with the binding node.
we can just go back to firebase js api and do something with the node. Example
nodeRef.push() .update() .remove().
To me, this is better than using angularFireCollection().methods(). Because
angularCollection is not completed compare to firebase js api
I don't have to learn / know AGAIN how ngFire works since I alredy learnt in firebase
different methods name confusing me. angularFireCollection().add() vs new Firebase().push()

Answer 1

The answer is that you do not have to use angularFireCollection at all. You can utilize Firebase methods directly. You can also use angularFire or angularFireCollection to sync data down to your client and then push data using Firebase methods directly.
angularFire and angularFireCollection are not a replacement for Firebase, but rather are wrappers intended to abstract away some of the complexities of syncing data to Angular bindings. To get an understanding of what those complexities are, you can simply look at the angularFireCollection code, and see the number of cases that have to be handled.
Consider the following example:
<h1>Hello {{user.name}}</h1>
<input ng-model="user.name" ng-change="change()" />
Without angularFire:
function($scope) {
$scope.user = {};
$scope.change = function() {
new Firebase('URL/users/kato/name').set($scope.user.name);
};
new firebase('URL/users/kato').on('value', function(snap) {
$scope.user = snap.val()||{};
});
}
With angularFire:
function($scope, angularFire) {
angularFire(new Firebase('URL/users/kato'), $scope, 'user');
}
Or, something more sophisticated:
<ul>
<li ng-repeat="user in users">
{{user.name}}
<input ng-model="user.name" ng-change="change(user)" />
</li>
</ul>
Without angularFireCollection, this would be 100+ lines of code (i.e. about the length of the angularFireCollection object) as it needs to handle child_added, child_removed, child_changed, and child_moved events, adding them into an ordered array for Angular's use, looking up keys on each change and modifying or splicing, maybe even moving records in the array. And it also needs to add changes on the client and sync them back to Firebase by finding the correct key for each record.
With angularFireCollection, it can be done in a few lines, like so:
function($scope, angularFireCollection) {
$scope.users = angularFireCollection(new Firebase('URL/users/kato'));
$scope.change = function(user) {
$scope.users.update(user);
};
}
Of course, these abstractions don't cover every use case and there are certainly plenty of places that using Firebase directly is both practical and appropriate.
Hope that helps.