title: Ionic/Angularjs nested tabs issue
body: <p>I'm having a bit of an issue trying to get my app navigation working. I have a set of tabs nested inside another set of tabs. However when I click on the high level tabs for main navigation, I try to set it to the first view inside the second level tabs, however it seems to iterate over all the tabs twice, and ends on the last tab. </p>
  
  <p>Here's my codepen: <a href="http://codepen.io/anon/pen/MYWvgj?editors=101" rel="nofollow">http://codepen.io/anon/pen/MYWvgj?editors=101</a> </p>
  
  <p>Main Level Tabs:</p>
  
  <pre><code>&lt;ion-tabs class="tabs-icon-top tabs-positive"&gt;
          &lt;ion-tab title="Home" icon="ion-home" ui-sref="tabs.home"&gt;
              &lt;ion-nav-view name="home-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
          &lt;ion-tab title="About" icon="ion-ios7-information" ui-sref="tabs.about.page1"&gt;
              &lt;ion-nav-view name="about-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  &lt;/ion-tabs&gt;
  </code></pre>
  
  <p>Second Level Tabs:</p>
  
  <pre><code>&lt;ion-tabs class="tabs-striped tabs-top tabs-background-stable"&gt;
            &lt;ion-tab title="Page 1" ui-sref="tabs.about.page1" on-select="page1()"&gt;
              &lt;ion-nav-view name="about-page"&gt;&lt;/ion-nav-view&gt;
            &lt;/ion-tab&gt;
  
            &lt;ion-tab title="Page 2" ui-sref="tabs.about.page2" on-select="page2()"&gt;
              &lt;ion-nav-view name="about-page"&gt;&lt;/ion-nav-view&gt;
            &lt;/ion-tab&gt;
    &lt;/ion-tabs&gt;
  </code></pre>
  
  <p>About views:</p>
  
  <pre><code>&lt;script id="templates/about-page1.html" type="text/ng-template"&gt;
      &lt;ion-view title="About Page 1"&gt;
          &lt;ion-content class="padding has-tabs-top"&gt;
              About Page 1
          &lt;/ion-content&gt;
      &lt;/ion-view&gt;
  &lt;/script&gt;
  
  &lt;script id="templates/about-page2.html" type="text/ng-template"&gt;
      &lt;ion-view title="About Page 2"&gt;
          &lt;ion-content class="padding has-tabs-top"&gt;
              About Page 2
          &lt;/ion-content&gt;
      &lt;/ion-view&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>And here's the important states:</p>
  
  <pre><code>.state('tabs.about', {
      url: "/about",
      abstract: true,
      views: {
          'about-tab': {
              templateUrl: "templates/about.html"
              controller: "tabController"
          }
      }
  })
  
  .state('tabs.about.page1', {
      url: "/page1",
      views: {
          'about-page': {
              templateUrl: "templates/about-page1.html"
          }
      }
  })
  
  .state('tabs.about.page2', {
      url: "/page2",
      views: {
          'about-page': {
              templateUrl: "templates/about-page2.html"
          }
      }
  });
  </code></pre>
  
  <p>The example I'm talking about is click the 'About' tab, it's set to render page 1, but for some reason it always ends up on page 2 and I'm not sure why. Does anyone have any idea what I'm doing wrong? </p>
  
  <p>Thanks!</p>