Search code examples
angularjstabsng-gridangular-strap

How to Close Angular-Strap Tabs


In my app I have 3 static tabs that get rendered when the application loads. Using ng-grid, when a user double clicks on a row a new tab is generated with the results of that row. My question is..... how do I close the tab? It seems so simple but, I've goggled and tinkered with no results.

What I'd like is that after viewing the results the user would click on a small X near the tab heading to close/dismiss the tab. I've created a plunker http://plnkr.co/edit/ZkamtnBK01h0IvC9Hmjh?p=preview that resembles my tab layout. It has a button that you can click to add a new tab. Any help would be greatly appreciated. Thank you.


Solution

  • you can easily remove tabs by altering scope, http://plnkr.co/edit/AKlmUaRkaYWjOYnPRnWF

    $scope.remove = function() {
        $scope.tabs.splice($scope.tabs.activeTab,1);
    }
    

    These tabs are problably created with templates from the tabs directive, so I suggest using css positioning the element outside the bs-tabs div to get the effect you want