显示 mdTooltip 直到单击，再次单击时隐藏 [英] Show mdTooltip until clicked, hide when clicked again

问题描述

我正在尝试禁用鼠标悬停效果并在单击时触发 mdTooltip 并在再次单击时禁用它.有可能这样做吗?我认为 .toogle() 方法将是正确的工具，不幸的是它的工作方式相反.

<div style="text-align: center;"><span matTooltip="工具提示！"#tooltip="matTooltip" (click)="tooltip.toggle()">Test</span>

解决方案

你应该尝试使用 event.stopImmediatePropagation();

Plunker 示例

I'm trying to disable the mouse-hover effect and trigger mdTooltip on click and disable it on clicking again. Is it possible to do that? I thought the .toogle() method would be the right tool for that unfortunately it works the opposite way.

<div style="text-align: center;">
   <span matTooltip="Tooltip!" #tooltip="matTooltip" (click)="tooltip.toggle()">Test</span> 
</div>

解决方案

You should try using event.stopImmediatePropagation();

<span matTooltip="Tooltip!" 
  (mouseenter)="$event.stopImmediatePropagation()" 
  (mouseleave)="$event.stopImmediatePropagation()"
  #tooltip="matTooltip" (click)="tooltip.toggle()">Test</span> 

Plunker Example

这篇关于显示 mdTooltip 直到单击，再次单击时隐藏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！