0

Angular のフロント ページのタブの例を使用しています。チェックボックスオプション（「高度な表示」など）を使用して、条件付きでタブの1つを非表示にしたい....

<pane title="Pluralization" ng-show="showPlural">

ここに例を設定しました...

http://jsfiddle.net/michaeldausmann/RJEGY/#base

チェックボックスがオンになっているかどうかにかかわらず、タブは正しくレンダリングされません。タブディレクティブに飛び込んでリファクタリングする前に、誰かがこの問題をすでに解決していますか? または、試すことができる代替タブの実装はありますか?

マイケル

4

1 に答える 1

1

わかりました、私はそれを理解しました。ディレクティブをハックして、ペインで新しい属性 (showtab) を取得する必要がありました。 

  scope: { 
          title: '@',
          tabshow: "="
         },

次に、タブテンプレート内の要素を非表示にします...

  template:
    '<div class="tabbable">' +
      '<ul class="nav {{navclass}}">' +
        '<li ng-repeat="pane in panes" ng-class="{active:pane.selected}" ng-hide="pane.tabshow==false">'+
          '<a href="" ng-click="select(pane)">{{pane.title}}</a>' +
        '</li>' +
      '</ul>' +
      '<div class="{{tclass}} tab-content" ng-transclude></div>' +
    '</div>',

およびペイン テンプレート

  template:
    '<div ng-hide="tabshow==false" class="tab-pane" ng-class="{active: selected}" ng-transclude>' +
    '</div>',

次に、ページで、ng-show の代わりに tabshow を使用します。

フィドルをチェックしてください。

http://jsfiddle.net/michaeldausmann/RJEGY/1/

HTH

マイケル

于 2013-05-27T11:29:18.970 に答える