我有一个ng2工具提示指令工具提示，其中包含html内容。当鼠标悬停在文本上时，会显示此工具提示。但是，当我尝试将光标移动到工具提示内容中(以复制工具提示数据(时，它会消失。要求是手动复制工具提示内容。请帮忙。
<div style="display: inline-block">
<span style="font-size: small;">ToolTip: </span>
<span [ngClass]="getContractcodeClass()"
[tooltip]="ToolTipContent"
content-type="template"
trigger = "hover"
placement="bottom"
theme="light"
[display]="showContractCodeDataOnHovering"
max-width="500"
offset="0"
pointerEvents="auto"
hide-delay="200">{{ToolTipData}}
</span>
</div>
<ng-template #ToolTipContent>
<html>
<br/>
<body style="padding-left: 15px;">
<strong>{{contractCodeKeys?.ContractCodeDetails}}</strong>
<div><p style="width: 95%; display: table;"></p></div>
<div class="row">
<p style="width: 95%; margin-right: 10px;display: table;">
<span style="display: table-cell; border-bottom: 1px solid rgba(0, 0, 0, 0.404);"></span>
</p>
</div>
<div class="row">
<span class="columnName">{{id}}</span>
<span class="columnValue">{{idValue}}</span>
</div><br/>
<div class="row">
<span class="columnName">{{name}}</span>
<span class="columnValue">{{nameValue}}</span>
</div><br/>
</body>
</html>
</ng-template>
下方的css
.value-contractcode{
font-weight: 700 !important;
}
.value-contractcodeNumber{
font-weight: 700 !important;
color:#006bbd
}
.text-contractcode{
font-size: small;
padding-left:50px
}
.columnName {
float: left;
width: 40%;
color: grey
}
.columnValue {
float: left;
padding-left: 20px;
width: 60%;
font-weight:bold;
}
.row{
word-wrap: break-word;
}
我认为您无法复制文本，因为使用了悬停效果而不是单击。如果你调查点击和悬停的演示-http://ivylab.space/tooltip/demo，您将看到您只能使用单击来复制文本。