2017-10-23 8 views
0

プロジェクトでは、Angularjs 1.3.6とBootstrap 3.1.1を使用します。ng-hideで折り畳みエフェクトが動作しない

私はng-repeat(いくつかのフィルタ付き)とng-hideを持つ2つの列に配列の内容を表示します。

<div class="first-col"> 
     <div class="formation-panel" ng-repeat="formation in formations | filter:formationType | filter:search | formationsAnnee:this" ng-hide="$index%2"> 
      @formation() 
     </div> 
</div> 

<div class="second-col"> 
     <div class="formation-panel" ng-repeat="formation in formations | filter:formationType | filter:search | formationsAnnee:this" ng-hide="($index+1)%2"> 
      @formation() 
     </div> 
</div> 

@formation()構文はプレイフレームワークから来ています。これは、次のコンテンツをレンダリング:

<div class="formation-panel-heading" data-toggle="collapse" href="#formation-body-{{formation.id}}"> 
      ...Heading... 
</div> 
<div class="formation-panel-body" id="formation-body-{{formation.id}}"> 
     ...Some content... 
</div> 

(私はあまりミックスインとの見出しに折りたたまれたクラス属性)

2列に表示される要素は、ブートストラップパネルです。私はそれらのパネルに崩壊効果を適用したい:私たちが見出しをクリックすると、体は崩壊しなければならない。 最初の列でうまく動作しますが、2番目の列ではまったく動作しません。

私にとっては意味がありません。その問題の原因を知っていますか?

答えて

0

私は角ng-hideとブートストラップ崩壊効果の共存の問題を解決していなかったが、私はng-showと機能をレンダリングするために達成:私はng-repeatで表示私のオブジェクトへのfalseに初期化show属性を、影響を受けました。 見出しは次のようになります。

<div class="formation-panel-heading" ng-click="formation.show=!formation.show">...</div> 

と体:

<div class="formation-panel-body" ng-show="formation.show"> 
関連する問題