title: AngularJS - How do I modify variables in $rootScope?
body: <p>I've got a potentially really dumb question, but how do I modify variables up in $rootScope in Angular? I've got a slide-in sidebar that I want to change the content on whenever someone clicks on a thumbnail, and I figured the easiest way to handle where the data in the sidebar comes from/the sidebar visibility would either be in global values, or in $rootScope. I'm trying to keep everything as simple as possible, but I just don't know how to handle modifying global variables.</p>
  
  <p>My angular code surrounding this is:</p>
  
  <pre><code>app.run(function($rootScope) {
      $rootScope.currentUrl = { value: 'visual/design/1/' };
      $rootScope.detail_visible = { value: true };
  });
  
  app.controller('navController', ['$scope', '$rootScope', 
      function ($scope, $rootScope) {
  
      $scope.isDetail = $rootScope.detail_visible.value;
      $scope.url = $rootScope.currentUrl.value;
      $scope.hide = function($rootScope) {
          $rootScope.detail_visible.value = false;
      };
  }]);
  </code></pre>
  
  <p>and the connecting HTML is</p>
  
  <pre><code>&lt;div id="detail_box" ng-class="{d_show: isDetail, d_hide: !isDetail}"&gt;
      &lt;a href="#" class="box_close" ng-click="hide()"&gt;&lt;/a&gt;
      &lt;div ng-include="url + 'detail.html'"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>In essence, I'm trying to make it so that when you click on a thumbnail, it changes the currentUrl value from 'visual/design/1/' to whatever they've clicked on (like, 'music/solo/2' or whatever) then changes the value of detail_visible to false, so that the classes on my sidebar switch and I get a nice little slide-in, with fresh content loaded via ng-include which I kind of love a thousand times more than I thought I would. I've been banging my head against this for about three hours now, breaking everything else on this app whenever I get the chance. What am I screwing up here?  Alternatively, is there a better way of doing this?</p>
  
  <p>My reason for using global variables is that I have multiple thumbnails in multiple controllers, and I want each one to be able to dynamically change the URL in my ng-include.</p>