Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html ng-app="myApp">
    <head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
      <script src="http://code.angularjs.org/1.2.2/angular.min.js"></script>
                
      <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>     
        <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/smoothness/jquery-ui.min.css">
        <meta charset=utf-8 />
        <title>GE Tabs Assessment</title>
    </head>
    <body>  
    <div ng-controller="myCtrl">
​
            <div data-h-tabs id="tabs">
                <ul>
                    <li ng-repeat="tab in tabs">
                        <a href="#tabs-{{$index}}">{{tab.title}}</a>
                    </li>
                </ul>
                <div id="tabs-0">
                    <p>
                        Content for Tab 0
                    </p>
                </div>
                <div id="tabs-1">
                    <p>
                        Content for Tab 1
                    </p>
                </div>
                <div id="tabs-2">
                    <p>
                        Content for Tab 2
                    </p>
                </div>
            </div>
​
        </div>
    </body>
</html>
 
var app=angular.module('myApp', []).controller('myCtrl', function ($scope, $http) {
    $scope.tabs = [];
    $http.get('http://www.json-generator.com/j/bUvVBgLhiW?indent=4').success(function(data) {
        $scope.tabs=data;           
    }); 
    
})
.directive('hTabs', function() {
    return {
        restrict: 'A',
        link: function(scope, elm, attrs) {
            var jqueryElm = $(elm[0]);
            $(jqueryElm).tabs();
        }
    };
});
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers