设置活动标题Angular UI选项卡

时间:2016-10-04 13:34:49

标签: angularjs angular-ui angular-ui-tabset

我正在使用Angular ui.bootstrap.tabs指令。我需要设置选项卡的活动标题。 但是当我尝试使用这个指令时,它没有设置类激活

所以这是Demo:

<uib-tabset active="active">
    <uib-tab index="0" heading="Static title">Static content</uib-tab>
    <uib-tab index="$index + 1" ng-repeat="tab in tabs" heading="{{tab.title}}" disable="tab.disabled">
        {{tab.content}}
    </uib-tab>
    <uib-tab index="3" select="alertMe()">
        <uib-tab-heading>
            <i class="glyphicon glyphicon-bell"></i> Alert!
        </uib-tab-heading>
        I've got an HTML heading, and a select callback. Pretty cool!
    </uib-tab>
</uib-tabset>

检查员的代码:

<li ng-class="[{active: active, disabled: disabled}, classes]" class="uib-tab nav-item ng-isolate-scope [object Object]" index="3">

我认为错误就在这里 - [object Object]但我不知道如何跟踪它。

我的导轨需要:

//= require angular
//= require angular-rails-templates
//= require angular-ui-router
//= require angular-ui-bootstrap
//= require angular-ui-bootstrap-tpls
//= require angular-ui-select
//= require angular-animate
//= require interact
//= require angular-devise
//= require angular-datepicker
//= require moment
//= require moment-timezone
//= require ng-file-upload
//= require_tree .

app.js:

angular.module('flapperNews', ['ui.router', 'ui.bootstrap', 'templates', 'Devise', 'datePicker', 'ngFileUpload', "ui.select"]).config([
'$stateProvider',
'$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
}]);

控制器:

angular.module('flapperNews').controller('EventsCtrl', [
'$scope',
'events',
    'Auth',
function($scope, events, Auth){
    $scope.auth = Auth.isAuthenticated()
    $scope.events=events
    $scope.deleteEvent = function(id){
        events.destroy({
            id: id,
        });
    }
    console.log($scope)

}])

0 个答案:

没有答案