nav-tab和tab-content的嵌套ng-repeat

<div ng-controller="MyController">
  <ul class="nav nav-tabs">
    <li ng-repeat="tab in tabs" ng-class="{active: tab.active}">
      <a ng-click="selectTab(tab)">{{tab.title}}</a>
    </li>
  </ul>

  <div class="tab-content">
    <div ng-repeat="tab in tabs" ng-show="tab.active">
      <h3>{{tab.title}}</h3>
      <p>{{tab.content}}</p>
    </div>
  </div>
</div>

app.controller('MyController', function($scope) {
  $scope.tabs = [
    { title: 'Tab 1', content: 'Content 1', active: true },
    { title: 'Tab 2', content: 'Content 2', active: false },
    { title: 'Tab 3', content: 'Content 3', active: false }
  ];

  $scope.selectTab = function(tab) {
    angular.forEach($scope.tabs, function(tab) {
      tab.active = false;
    });
    tab.active = true;
  };
});