2017-07-25 4 views
0

私はAngularで始まります。要素を "ng-repeat"に置き換え、他の人にはfalseにしますか?(AngularJS)ng-repeatの1つの要素に対して "ng-show"を真にする

私はこのコードで自分自身を説明します。

htmlファイル:

 <tbody ng-repeat="elem in List" ng-init="visible = false"> 
        <tr ng-class="elemSelected(elem)"> 
         <td colspan="3"> 
          <a href ng-click="clickElemScroll(Elem)" > 
          <span class="glyphicon" ng-class="visible? 'glyphicon-chevron-down' : 'glyphicon-chevron-right'"></span> 
          <strong>{{elem.name}} </strong> 
          </a> 
         </td> 
        </tr> 
        <tr ng-show="visible" > 
         blabla 
        </tr> 
</tbody> 

JSファイル:

$scope.clickElemScroll = function (elem) { 
        if ($scope.elemSelected === elem) { 
         $scope.visible = true 
        } 
       }; 

ご存知のように、問題はどのように、すべてのelemがスクロールされているがクリックした要素だけを表示させるには?

答えて

0

ngRepeatで使用する要素に新しいプロパティを設定できます。また、ng-classで何が起こっているのか分からないが、そこに関数を使用することはお勧めしない。あなたが選択したクラスを設定しようとしている場合は、ng-class="{'selected': elem.selected}"

<tbody ng-repeat="elem in List"> 
     <tr ng-class="elemSelected(elem)"> 
      <td colspan="3"> 
        <a href ng-click="elem.selected = !elem.selected"> 
        <span class="glyphicon" ng-class="visible? 'glyphicon-chevron-down' : 'glyphicon-chevron-right'"></span> 
         <strong>{{elem.name}} </strong> 
        </a> 
      </td> 
     </tr> 
     <tr ng-show="elem.selected"> 
      blabla 
     </tr> 

+0

こんにちははあなたの答えのための偉大なおかげで、それが動作するような何かを試してみてください! :) 私は要素をクリックすると、他の要素を閉じる(elem.selectedすべてのelem)ことが可能ですか?(これだけが開いていなければならないので、真と同じですか? –

+0

私は2番目の質問は、要素をクリックしたときに他の要素を閉じた(elem.selectedを除くすべてのelemに対して)ことが可能かどうかです(この1つだけが開く必要があります)? –

+0

これは少し異なる実装です。 ng-clickを関数にして、それぞれの要素を通り、選択されていないか選択されているforループを実行する必要があります。ngRepeatでは、 '$ index'で要素の現在のインデックスを取得できます。あなたが他のものを閉じたい場合は、ng-click = "setSelected($ index)" 'のようなもので、コントローラはその関数を定義します。 'List [i] .selected =(i === $ index);' – Ero

関連する問題