md-selected not working properly in md-tab

var app = angular.module('tabsDemo', ['ngMaterial']);
app.controller('TabsController',tabsController);
function tabsController($scope){
    $scope.showBack = false;
    //$scope.selectedIndex = 3;
    $scope.tabs = [1,2,3,4,5,6];
    $scope.changeTabs = function(){
      $scope.showBack = true;
      $scope.tabs = ['a','b'];
    }
    $scope.goHome = function(){
      $scope.showBack = false;
      $scope.tabs = [1,2,3,4,5,6];
      $scope.selectedIndex = 3;
    }
}

<link href="https://rawgit.com/angular/bower-material/master/angular-material.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.js"></script>
<script src="https://rawgit.com/angular/bower-material/master/angular-material.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-animate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular-aria.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">
      
<div ng-app="tabsDemo" ng-controller="TabsController">

  <md-button ng-show = "showBack" ng-click = "goHome()">
   <i class="material-icons">keyboard_backspace</i>
  </md-button>
  
  <md-tabs md-selected="selectedIndex" md-stretch-tabs>
    <md-tab ng-repeat="tab in tabs" label="{{tab}}">
      <div style="text-align: center;">
      
         <button ng-bind="tab" ng-click="changeTabs()"></button>
            
      </div>
    </md-tab>
  </md-tabs>
</div>