angularjs鼠標移入移出實現顯示隱藏
阿新 • • 發佈:2018-04-09
ucc 隱藏 itl -s 技術分享 btn 操作 image lis
<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實現動態拼接變量
截圖如下:
angularjs鼠標移入移出實現顯示隱藏