【问题标题】:Tab is not shown after tab's disabled and active property are set to true. Angularjs Tabs选项卡的 disabled 和 active 属性设置为 true 后不显示选项卡。 Angularjs 选项卡
【发布时间】:2013-07-08 11:56:40
【问题描述】:

我正在使用 Angularjs。 我正在使用 Tabs 和手风琴指令。 When tab's disabled and active properties are set to true, tab's content is not showing up. 这是重现该问题的my plunker snippet。单击 PL 项目并单击模式 1。模式选项卡将变为活动状态,但未显示。 我有一种直觉,这是由于 ng-include 造成的,但不明白为什么......

Index.html

  <div ng-controller="LeftPaneCtrl">
      <tabset>          
                <tab ng-repeat="tab in leftPane.tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled">
                     <div ng-include="tab.content"></div>
                </tab>
            </tabset>
            </div>
  </body>

Modules.Html:

<accordion close-others="true">    
    <accordion-group heading="{{module.displayName}}" ng-repeat="module in leftPane.modules">
        <div ng-repeat="mode in module.modes" >
            <a style="color: green" ng-click="leftPane.selectMode(module, mode)">{{mode.title}} </a>    
        </div>        
    </accordion-group>    
</accordion>

Srcipt.js:

function LeftPaneModel() {
    this.tabs = [
        { title: "Modules", content: "Modules.html", active: true},
        { title: "Modes", content: "Modes.html", disabled: true, active: false },
        { title: "Reports", content: "Reports.html", disabled: true, active: false }
    ];
    this.modulesTab = this.tabs[0];
    this.modesTab = this.tabs[1];
    this.reportsTab = this.tabs[2];
    this.modules = [];
    this.modules.push({displayName:'PL',modes:[{title:'Mode 1',id:'Mode1'},{title:'Mode 2',id:'Mode2'}]})
    this.selectMode = function(module, mode) {    
        var tab = this.modesTab;            
        tab.title = mode.title;                
        tab.active = true;
        tab.disabled = false;
    };
}
var emsApp = angular.module('EmsWeb', ['ui.bootstrap']);

emsApp.controller('LeftPaneCtrl', ['$scope',function($scope) {

  $scope.leftPane = new LeftPaneModel();

}]);

感谢任何想法。

【问题讨论】:

    标签: angularjs tabs


    【解决方案1】:

    我作为一个问题与 angular-ui 团队一起发布。他们解决了这个问题,应该在下一个版本中。 这是线程的link

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-03-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多