使用Angular Material中的tooltip显示多行从数据库取得的数据,结果只能显示出第一条数据

发布于 2022-09-02 08:59:56 字数 947 浏览 12 评论 0

我想用tooltip来展示管理员操作的历史记录,在tooltip中每一行列出每一次管理员更改用户状态的记录信息,如下图所示:
图片描述

现在遇到的问题是,鼠标放到Button上时,弹出的tooltip中只展示了一行记录,剩下的记录没有正常显示出来,在chrome浏览器中能看到有剩下的记录的Dom结构。
“历史按钮”的那一部分代码如下:

<md-button class="md-icon-button" data-ng-mouseover="operation_history($event, u.uid)">
  <md-tooltip md-direction="bottom" style="width: 250px;">
  <div data-ng-show="true">
  <div data-ng-repeat="operation_history in operation_historys">
  <span>{{operation_history.create_name}}:      {{operation_history.create_time}}&nbsp;
 {{operation_history.old_status}} -&gt;{{operation_history.new_status}}    </span><br>
  </div>
  </div>
  </md-tooltip>
  <i class="material-icons md-18">history</i>
</md-button>

不知道是不是tooltip本身样式的问题。。。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

ぶ宁プ宁ぶ 2022-09-09 08:59:56

在stackoverflow上的提问,有朋友给回复了。头一回在stackoverflow上提问,以为别人看不懂我蹩脚的英文描述的,结果看懂了。解决方案如下,加入如下样式:
.md-content.md-show {
height: auto !important;
}

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文