title: Angular UI Router replace view on runtime
body: <p>I'm trying to change a parent view template on runtime - inside a service.</p>
  
  <p>My app config looks like:</p>
  
  <pre><code>$stateProvider
  .state('base', {
      abstract: true,
      views: {
          'header':       {
              controller: 'HeaderCtrl',
              templateUrl: 'header.html'
          },
          '': {
              template: '&lt;div ui-view="main"&gt;&lt;/div&gt;'
          }
      }
  })
  .state('base.home', {
      url: '/',
      views: {
          'main': {
              controller: 'SomeContentCtrl',
              templateUrl: 'content.html'
          }
      }
  });
  </code></pre>
  
  <p>I then have a service which is called from SomeContentCtrl that will listen for an event and upon such event I want to set the templateUrl for the header to null. Something like:</p>
  
  <pre><code>angular
      .module('RemoveTemplate', [ ])
      .factory('RemoveTemplate', ['$window', '$view', '$state',
          function RemoveTemplate ( $window, $view, $state ) {
  
              var windowElem  = angular.element($window);
  
              var listen   = function ( ) {
                  windowElem.on('RemoveTemplate', function ( event ) {
                      $view.load('header@base', {
                          templateUrl: null
                      });
  
                      // Trying both, even tried without refreshing the state
                      $state.reload();
                      $state.go('wh.lobby');
                  });
              };
  
              return {
                  listen:  listen
              };
  
          }
      ]);
  });
  </code></pre>
  
  <p>But this isn't working at all. Have anyone came across a similar use case before?</p>
  
  <p>Thanks</p>