• A simple array with two properties, save the file in the home directory. Append the following code in the homeCtrl.js file right after the modal directive:
    .controller('BootstrapTabCtrl', function ($scope, $http) {
    
      // Added some content to Tab / can be from a JSON with $http or $resource
      $http.get('app/home/tab-content.json').
      success(function(data) {
        // Get dynamic data from JSON file
        $scope.tabs = data;
      }).
      error(function(status) {
        // if error, show status
        console.log(status);
      });
    })
  • Now, let’s add the HTML code to the home.html file, right after the modal code:
    <!-- Bootstrap Tab -->
    <div style="width:600px; margin:20px auto;">
      <div ng-controller="BootstrapTabCtrl">
        <tabset>
          <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled">
          {{tab.content}}
          </tab>
        </tabset>
      </div>
    </div>