angularjs鼠標移入移出實現顯示隱藏

<tr ng-repeat="item in items track by $index">
    <td data-title="操做" align="center" ng-mouseenter="$parent['buttonList'+$index] = true" ng-mouseleave="$parent['buttonList'+$index] = false">
          <div ng-show="!$parent['buttonList'+$index]">操做</div>
           <div ng-show="$parent['buttonList'+$index]">
                  <button class="btn btn-primary fa fa-download"></button>
                  <button class="btn btn-success fa fa-reply"></button>
                  <button class="btn btn-primary fa fa-edit"></button>
                  <button class="btn btn-danger fa fa-trash"></button>
             </div>          
    </td>
</tr>

  主要是ng-mouseenter和ng-mouseleave配合使用,同時注意$parent實現動態拼接變量html

  截圖以下:htm

    

相關文章
相關標籤/搜索