如果元素的内容溢出，则在 html 元素内显示一个图标答案

【问题标题】：show an icon inside a html element if the element has content that is overflowing如果元素的内容溢出，则在 html 元素内显示一个图标
【发布时间】：2018-07-19 16:02:20
【问题描述】：

当 div 内的内容溢出时，我想显示复制到剪贴板图标

我有四个 div 的 ng，如果其中任何一个 div 溢出，我想为相应的 div 显示一个图标。

<div *ngFor div of FourDivs (mouseenter)="IfDivHasOverflow($event)">
  <div *ngIf="hasOverflow"></div>
</div>

脚本： @零件我的组件（） {

 hasOverFlow:boolean = false;

 IfDivHasOverflow(event) {
   if(event.scrollHeight < event.cleintHeight) {
    this.hasOverflow = true;
   }
 }

问题是“hasOverflow”对 ngfor 重复中的每个 div 都是正确的。所有四个 div 都在里面显示一个图标，而需要的是具有溢出以包含图标的特定 div。

有什么办法解决这个问题吗？

【问题讨论】：

标签： javascript angular overflow ngfor angular-ng-if

【解决方案1】：

基本上，每个div 都需要一个hasOverflow 标志。

试试下面的代码：

<div *ngFor="div of FourDivs" (mouseenter)="IfDivHasOverflow($event, div)">
  <div *ngIf="div.hasOverflow"></div>
</div>


 IfDivHasOverflow(event, div) {
    div.hasOverflow = false;
   if(event.scrollHeight < event.cleintHeight) {
    div.hasOverflow = true;
   }
 }

【讨论】：