我在 Angular 4 材料表单元格中有一个按钮，我希望仅当鼠标悬停在表行上时才显示该按钮：
<md-cell *cdkCellDef="let row" contenteditable='false' >
<div *ngIf="!row.editorEnabled" >{{row.goalStatusName}}
<button md-icon-button><md-icon (click)="row.editorEnabled=true;" mdTooltip="Edit">mode_edit</md-icon></button>
</div>
</md-cell>
我该如何实现这一目标？
更新：
整个代码：
<md-cell *cdkCellDef="let row" contenteditable='false' >
<div *ngIf="!row.editorEnabled" >{{row.goalStatusName}}
<button md-icon-button><md-icon (click)="row.editorEnabled=true;" class="editButton" mdTooltip="Edit">mode_edit</md-icon></button>
</div>
<div *ngIf="row.editorEnabled" >
<md-input-container><input mdInput [(ngModel)]="row.goalStatusName" #goalName></md-input-container>
<button md-icon-button>
<md-icon (click)="modifyGoal(row.goalStatusId,row.goalStatusName)" mdTooltip="Save" style="color:green;font:bold;" >done</md-icon>
</button>
<button md-icon-button>
<md-icon (click)="row.editorEnabled=false" mdTooltip="Cancel" style="color:red;font:bold;" >clear</md-icon>
</button>
</div>
</md-cell>
button{ display:none}
md-cell:hover{
button{
display:block
}
}
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
