title: UI-Router's ui-sref creating wrong href
body: <p>I have a SPA with 2 ui-views: header and body. The header is run by one controller, and the controllers that handle the body (depending on the state) make a call to a service function I created as follows:</p>
  
  <pre><code>    /**
       * Sets the header bar's attributes
       *
       * @param inverse bool Whether the color scheme should be inverted
       * @param button bool Whether the back button should be presented
       * @param link string The route the back button will take the user to when pressed
       * @param title string The translation key to use for the title to be shown in the headerbar
       * @param data string Characters to be inserted in the span next to the title
       *
       **/
      return {
          set: function(inverse, button, link, title, data) {
              // set defaults
              inverse = typeof inverse !== 'undefined' ? inverse : false;
              button = typeof button !== 'undefined' ? button : false;
              link = typeof link !== 'undefined' ? link : $state.current.name;
              title = typeof title !== 'undefined' ? title : undefined;
              data = typeof data !== 'undefined' ? data : false;
              // store for HeaderController to retrieve
              $localStorage.headerInverse = inverse;
              $localStorage.headerBackButton = button;
              $localStorage.headerBackLink = link;
              $localStorage.headerTitle = title;
              $localStorage.headerData = data;
  
              broadcast.announce('setHeader');
          }
      };
  </code></pre>
  
  <p>Like so:</p>
  
  <pre><code>    header.set(true, true, 'app.search1', 'MY_PROFILE');
  </code></pre>
  
  <p>The header's controller listens to the broadcast with:</p>
  
  <pre><code>    broadcast.listenFor('setHeader', function() {
          vm.headerTitle = $localStorage.headerTitle; // expects the translation key to look up
          vm.headerData = $localStorage.headerData;
          vm.headerInverse = $localStorage.headerInverse;
          vm.headerBackLink = $localStorage.headerBackLink;
          vm.headerBackButton = $localStorage.headerBackButton;
          vm.headerMoreIcon = $localStorage.headerMoreIcon;
      });
  </code></pre>
  
  <p>And the header's html has:</p>
  
  <pre><code>    &lt;a ui-sref="{{ vm.headerBackLink }}"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>So what I would expect is:</p>
  
  <pre><code>    &lt;a href="#/search1" ui-sref="app.search1"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>Yet what I'm getting rendered is:</p>
  
  <pre><code>    &lt;a href="#/profile" ui-sref="app.search1"&gt;&lt;/a&gt;
  </code></pre>
  
  <p>Any help would be appreciated. Thanks!</p>