title: Ensure binding for $watch when $firebaseArray or $firebaseObject returns empty
body: <p>I am using Angularfire and there is a situation when <code>$firebaseArray</code> or <code>$firebaseObject</code> return nothing at first. It's because it's empty or not existed yet. But I want to do $watch for that object/array all the times. Let say later on, the node actually exists. The original <code>$firebaseArray</code> or <code>$firebaseObject</code> does not trigger $watch event. </p>
  
  <p>How do I ensure binding for $watch to happen even when the node is empty / not exist at first? This happens when I create a new user and there is nothing in a certain node.</p>
  
  <p><strong>UPDATE 1</strong></p>
  
  <p><a href="http://plnkr.co/edit/tQur74nkRIE9ZOiJUAgf?p=preview" rel="nofollow noreferrer">http://plnkr.co/edit/tQur74nkRIE9ZOiJUAgf?p=preview</a></p>
  
  <p><strong>JS</strong></p>
  
  <pre><code>var app = angular.module('plunker', ['firebase']);
  var Ref = new Firebase('https://so32556276.firebaseio.com');
  
  app.controller('MainCtrl', function($scope, $firebaseObject) {
    $scope.data = $firebaseObject(Ref.child('user'));
  
    $scope.data.$loaded().then(function(res) {
      $scope.data.$watch(function(e) {
        console.log('Something changed');
        console.log(e);
      });
    });
  
    $scope.changeName = function() {
      $scope.data.name = "test2";
      $scope.data.$save();
    }
  
    $scope.changeAge = function() {
      $scope.data.age = "10";
    }
  });
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>  &lt;body ng-controller="MainCtrl"&gt;
      &lt;p&gt;Hello {{data.name}}!&lt;/p&gt;
      &lt;p&gt;Your age is {{data.age}}!&lt;/p&gt;
      &lt;a href="" ng-click="changeName()"&gt;Change Name&lt;/a&gt;&lt;br&gt;
      &lt;a href="" ng-click="changeAge()"&gt;Change Age&lt;/a&gt;
    &lt;/body&gt;
  </code></pre>
  
  <p><strong>Firebase</strong></p>
  
  <p><a href="https://i.stack.imgur.com/pcBBl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/pcBBl.png" alt="enter image description here"></a></p>
  
  <p>If I click "Change Name", you can see the log event here:</p>
  
  <pre><code>Something changed
  app.js:10 Object {event: "value", key: "user"}
  </code></pre>
  
  <p>If I click "Change Age", although the frontend can detect the variable, <code>$watch</code> has no visibility into this. Nothing out in console.</p>
  
  <p>Any clue how to avoid this?</p>