Dev Stack Source

Answer : Another solution is to create something like this <div class="row"> <div class="col-sm-3"> <ul class="nav nav-tabs nav-stacked nav-pills" role="tablist"> <li ng-class="{'active': view_tab == 'tab1'}"> <a class="btn-lg" ng-click="changeTab('tab1')" href="">My Tab 1</a> </li> <li ng-class="{'active': view_tab == 'tab2'}"> <a class="btn-lg" ng-click="changeTab('tab2')" href="">My Tab 2</a> </li> </ul> </div> <div class="col-sm-9"> <div class="tab-content"> <div class="tab-pane" ng-show="view_tab == 'tab1'"> This is tab 1 content </div> <div class="tab-p...

Answer : so create a reusable service for that... read here code here: angular.module('yourModuleName').service('modalService', ['$modal', // NB: For Angular-bootstrap 0.14.0 or later, use $uibModal above instead of $modal function ($modal) { var modalDefaults = { backdrop: true, keyboard: true, modalFade: true, templateUrl: '/app/partials/modal.html' }; var modalOptions = { closeButtonText: 'Close', actionButtonText: 'OK', headerText: 'Proceed?', bodyText: 'Perform this action?' }; this.showModal = function (customModalDefaults, customModalOptions) { if (!customModalDefaults) customModalDefaults = {}; customModalDefaults.backdrop = 'static'; return this.show(customModalDefaults, customModalOptions); }; this.show = function (customModalDefaults, customModalOptions) { //Create temp objects t...