如何在ng-repeat循环中使用ng-show和ng-hide

时间:2016-11-03 13:04:15

标签: angularjs angular-material

这里我有代码:

<ul dnd-list="list" ng-controller="Modalcontrol">
  <li ng-repeat="item in list" ng-click="showAdvanced($event)">
    {{item.card_name}}
  </li>
</ul>
<span ng-click="$parent.selectedIndex=$index">Add </span>
<md-card class="card" ng-show="$parent.selectedIndex == $index" >
  <form name="colorForm" class="addcontdrag" >
    <md-input-container>
      <label>Add text</label>
    </md-input-container>

    <span>
      <md-button class="md-raised md-primary">Save</md-button>
      <i class="material-icons" ng-click="$parent.selectedIndex=$index">clear</i>
    </span>
  </form>
</md-card> 

在此代码中,我想在单击关闭按钮时隐藏md卡。使用$ parent.selectedIndex = $ index显示md-card。但我不知道如何用这个隐藏md卡。

如果有人知道请帮助我。

谢谢高级......

1 个答案:

答案 0 :(得分:0)

您必须将md-card置于li标签内才能获得$index

<ul dnd-list="list" ng-controller="Modalcontrol">
  <li ng-repeat="item in list" ng-click="showAdvanced($event)">
    {{item.card_name}}
    <span ng-click="$parent.selectedIndex=$index">Add </span>
   <md-card class="card" ng-show="$parent.selectedIndex == $index" >
    <form name="colorForm" class="addcontdrag" >
    <md-input-container>
      <label>Add text</label>
    </md-input-container>

    <span>
      <md-button class="md-raised md-primary">Save</md-button>
      <i class="material-icons" ng-click="$parent.selectedIndex=$index">clear</i>
    </span>
  </form>
  </md-card> 
  </li>
</ul>