title: How to create initial data structure in Firebase when user first loads app?
body: <p>I have an AngularJS application for which I'd like to persist various page state into Firebase. So for example, the initial data structure when the user visits the application for the first time is initialized in the controller function like so:</p>
  
  <pre><code>$scope.sections = {
    sectionA = true,
    sectionB = true,
    sectionC = true,
  };
  </code></pre>
  
  <p>And then I bind it to a Firebase location:</p>
  
  <pre><code>var fb = $firebase(new Firebase('http://myapp.firebaseio.com/settings/sections'));
  fb.$bind($scope, 'sections');
  </code></pre>
  
  <p>This appears to work at first. When I change the values in the $scope.sections object, the Firebase Forge view shows the values changing as well. But, when I reload my page, it resets the values in Firebase back to the defaults.</p>
  
  <p>How can I initialize the default values without overwriting when the page is reloaded?</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>I've tried using the loaded event to set the defaults if the loaded value is null:</p>
  
  <pre><code>$scope.sections = {}
  var fb = $firebase(new Firebase('http://myapp.firebaseio.com/settings/sections'));
  fb.$bind($scope, 'sections');
  fb.$on('loaded', function(value) {
    if (value == null) {
      $scope.sections = {
        sectionA = true,
        sectionB = true,
        sectionC = true,
      };
    }
  });
  </code></pre>
  
  <p>But although the defaults are briefly visible, some/all almost immediately are reset. I suspect this may be due to how I'm using these particular settings -- they are bound to the <code>isOpen</code> attributes of an Angular UI-Bootstrap Accordion directive, to control which sections of the page are open/visible. Something in the way that control is working is resetting some/all of the sections to closed, i.e. false, even though my defaults have all sections open.</p>
  
  <p><strong>Edit2:</strong></p>
  
  <p>I've resolved the issue I described above. The version of Angular-UI Bootstrap I was using had a bug in the way the isOpen attribute was being evaluated. Once I applied the fix from a later version, it worked as expected.</p>