title: ui-router - controller will load twice when calling $state.go in it
body: <h1>code:</h1>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Ui State Demo&lt;/title&gt;
      &lt;meta charset="utf-8"&gt;
  
      &lt;!--AngularJS v1.5.9--&gt;
      &lt;script type="text/javascript" src="angular.min.js"&gt;&lt;/script&gt;
  
      &lt;!--angular-ui-router v0.2.15--&gt;
      &lt;script type="text/javascript" src="angular-ui-router.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          var app = angular.module('uiDemo', ['ui.router']);
          app.config(function($stateProvider) {
              $stateProvider.state('parent', {
                  url: '/parent',
                  controller: 'ParentController'
              }).state('childOne', {
                  controller: 'ChildOneController',
                  template: '&lt;h1&gt;Child One&lt;/h2&gt;'
              }).state('childTwo', {
                  controller: 'ChildTwoController',
                  template: '&lt;h1&gt;Child Two&lt;/h2&gt;'
              });
          });
          app.controller('ParentController', ['$state', function($state) {
              console.log('Parent Controller Start');
              if (Math.round(Math.random()) == 0) {
                  $state.go('childOne');
              } else {
                  $state.go('childTwo');
              }
          }]);
          app.controller('ChildOneController', function() {
              console.log('Child One');
          });
          app.controller('ChildTwoController', function() {
              console.log('Child Two');
          });
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body ng-app="uiDemo"&gt;
      &lt;nav&gt;
          &lt;a ui-sref="parent"&gt;Parent&lt;/a&gt;
      &lt;/nav&gt;
  
      &lt;ui-view&gt;&lt;/ui-view&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>State <code>parent</code> has a url while <code>childOne</code> and <code>childTwo</code> have none. They share same url with <code>parent</code>.</p>
  
  <p>When I click <code>Parent</code>, it will redirect to <code>ChildOneController</code> or <code>ChildTwoController</code> by random, but will also load <code>ParentController</code> twice. </p>
  
  <p>It works fine if I put two different urls on both ChildControllers. But I want to keep the url same as parent after redirected to ChildControllers. </p>
  
  <p>Can someone help? How to avoid this twice loading issue?</p>