Как выбрать конкретную вкладку в целевом файле - PullRequest
Новая
       17

Как выбрать конкретную вкладку в целевом файле

0 голосов
/ 13 марта 2019

У меня есть две кнопки на html-странице, и если я нажимаю первую кнопку, я хочу выбрать первую вкладку в целевом html-файле. Если я нажму на вторую кнопку, я хочу выбрать вторую вкладку целевого HTML-файла.

Возможно ли это? Я слышал о ui-sref-active, но не понимаю, как я могу применить его в моем случае.

На моей странице home.html у меня есть: 

<div class="col-md-1">
    <button class="btn btn-info btn-lg" ui-sref="tab1"></button><br>Tab1
</div>
<div class="col-md-1">
    <button class="btn btn-info btn-lg" ui-sref="tab2"></button><br>Tab2
</div>

UI-роутер: 

.state('tab1', {
    parent: 'entity',
    url: '/tabs',
    views: {
        'content@': {
        templateUrl: 'app/entities/tabs.html',
        controller: 'TabsController',
        controllerAs: 'vm'
        }
    },
    resolve: {
    }
})

.state('tab2', {
    parent: 'entity',
    url: '/tabs',
    views: {
        'content@': {
        templateUrl: 'app/entities/tabs.html',
        controller: 'TabsController',
        controllerAs: 'vm'
        }
    },
    resolve: {
    }
})

tabs.html: 

<uib-tabset active="activeForm" id="rapportAlerteForm">
    <uib-tab
        index="0" heading="Tab1">
    </uib-tab> 
    <uib-tab
        index="1" heading="Tab2">
    </uib-tab> 
</uib-tabset>

1 Ответ

3 голосов
/ 13 марта 2019

Проверьте plunkr, если он вам полезен - https://plnkr.co/edit/xq0DyenMHwPse4CO9KJO?p=preview

<p><button type="button" class="btn btn-default btn-sm" ng-click="active = 1">Select second tab</button>
<button type="button" class="btn btn-default btn-sm" ng-click="active = 2">Select third tab</button>  </p>
...