title: Preventing parent state from reloading on child state change
body: <p>I am trying to implement a tabbed interface akin to this: <a href="http://odetocode.com/blogs/scott/archive/2014/04/14/deep-linking-a-tabbed-ui-with-angularjs.aspx" rel="nofollow">http://odetocode.com/blogs/scott/archive/2014/04/14/deep-linking-a-tabbed-ui-with-angularjs.aspx</a></p>
  
  <p>However, on my state change, the controller of the parent state seems to be reinitialized (or a new $scope is created?)</p>
  
  <p>There are two major differences between the example plunkr and my project. </p>
  
  <ol>
  <li>I use a parameter in my url</li>
  <li>I resolve different data on the state change for each tab (removing this does nothing). </li>
  <li>I am not using ui-bootstrap for the tabs but am triggering a $state.go on ng-click of the tab. </li>
  </ol>
  
  <p>I experimented with the above plunkr and added a dropdown to the parent state; however the parent dropdown values seem to persist when the child states change. I am not too concerned with the child states and will probably end up using sticky states anyways. </p>
  
  <p>I am using wondering if I am doing something fundamentally wrong before I try and add another package to my project. </p>
  
  <p>here is a rough plunkr of what I am trying to do: <a href="http://plnkr.co/edit/TmRQN5K8OEc8vHG84G5z?p=preview" rel="nofollow">http://plnkr.co/edit/TmRQN5K8OEc8vHG84G5z?p=preview</a></p>
  
  <p>here is my config:</p>
  
  <pre><code>  app.config(function($stateProvider, $urlRouterProvider){
  
          $urlRouterProvider.when('/main',
              function ($state) {
  
                  $state.go('parent.tab1', { main_id: '00008' });
              });
  
  
  
              $stateProvider
              //Handle States Here 
              .state('parent', {
                  abstract: true,
                  url: '/parent?main_id',
                  templateUrl: "main.html",
                  controller: 'Main_Controller',
                  resolve: {
                                  //Calls to API
                  }
  
  
              })
  
  
          .state('parent.tab1', {
              url: "/applications",
              templateUrl: "tab1.html",
              controller:'Tab1Ctrl',           
              resolve: {
                //Get some different data from an API
                   },
              })
  
  
          .state('parent.tab2', {
              url: "/phasing",
              templateUrl: "tab2.html",
              controller: 'Tab2Ctrl',
              resolve: {
                 //More API Data
                  }
              });
  
      });
  </code></pre>