12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455 |
- angular.module('tasks', ['ngRoute'])
- .directive('tabs', function () {
- return {
- restrict: 'A',
- transclude: true,
- scope: { style: "@tabs" },
- controller: [ "$scope", function ($scope) {
- $scope.panels = [];
- $scope.select = function (i) {
- angular.forEach($scope.panels, function (p) {
- p.selected = false;
- });
- $scope.panels[i].selected = true;
- };
- this.addPanel = function (panel) {
- if ($scope.panels.length === 0) {
- panel.selected = true;
- }
- $scope.panels.push(panel);
- };
- }],
- template: '<div class="tabbable">' +
- '<ul class="nav nav-{{style||\'pills\'}}">' +
- '<li ng-repeat="panel in panels" ng-class="{active:panel.selected}">' +
- '<a href="" ng-click="select($index)">{{panel.title}}</a>' +
- '</li>' +
- '</ul><br/>' +
- '<div class="tab-content" ng-transclude></div>' +
- '</div>',
- replace: true
- };
- })
- .directive('panel', function () {
- return {
- require: '^tabs',
- restrict: 'A',
- transclude: true,
- scope: { title: "@panel" },
- link: function (scope, element, attrs, tabsCtrl) {
- tabsCtrl.addPanel(scope);
- },
- template: '<div class="tab-panel" ng-show="selected" ng-transclude>' +
- '</div>',
- replace: true
- };
- })
- .config(function ($routeProvider) {
- $routeProvider.
- when('/', {templateUrl: 'templates/main.html', controller: 'MainCtrl'}).
- otherwise({redirectTo: '/'});
- });
|