可滚动 Turbo 表中的 PrimeNG 过滤器下拉问题

2024-04-30

在 prime-ng Turbo Table 中,当我们将过滤器下拉列表放入表内的可滚动表下拉列表中时

没有可滚动表下拉菜单就完美了。这工作完美 https://i.stack.imgur.com/16vjy.png

但是当可滚动表格时,下拉菜单将进入表格内部效果并不完美 https://i.stack.imgur.com/pFnho.png。 所以我想在表外而不是表内进行下拉菜单。

这是一个链接https://primeng-table-bry1sl.stackblitz.io/ https://primeng-table-bry1sl.stackblitz.io/查看代码。请以 1024 分辨率查看,以便您可以看到表格中的滚动并选择其中一个品牌来过滤数据。

谁能帮我。


尝试使用appendTo="body"Primeng 下拉菜单中提供了属性,这可能对您的情况有所帮助。

完整的例子在这里 -

<p-dropdown appendTo='body' [options]="value" [style]="{'width':'100%'}" placeholder="Select"></p-dropdown>

参考自here https://github.com/primefaces/primeng/issues/1205#issuecomment-288422093

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

可滚动 Turbo 表中的 PrimeNG 过滤器下拉问题 的相关文章

  • 如何中和 CSS 定义而不覆盖

    有没有一种方法可以中和元素的 CSS 规则而不覆盖所有内容 例如 我正在使用 Twitter Bootstrap 它有许多预定义的 CSS 定义table 在某些地方 我不想要它们 对某些table元素 我想知道我是否可以做这样的事情 ta
  • .net dropdownlist对齐文本

    我正在尝试将 net 下拉列表中的文本向右对齐 使用 CssClass 我可以在 Firefox 中将文本向右对齐 IE 不会将文本右对齐 而是左对齐 我读到 IE 6 不支持这个 这是真的 我使用的是 IE7 但我的大多数用户将使用 IE
  • CSS 字体在 Firefox 中不起作用

    我下面有这个字体代码 它在谷歌浏览器中工作正常 但在火狐浏览器中根本不起作用 为什么
  • 右列固定的 Div 表

    我最近接手了一个非营利网站作为一个项目 我正在使用一个现有的网站 所以我必须使用很多已经编程的东西 所以我所要做的就是创建设计 I made a diagram of basically what I can t figure out ho
  • Bootstrap 4alpha - 更改手机/桌面/平板电脑的徽标

    我有一个使用 bootstrap 4 alpha 的标头 div class container div class row div class col md 6 text md left text center div class nav
  • ngbModal 作为通用确认框

    我正在尝试使用 ngbmodal 创建通用确认框 它将在整个应用程序中使用 其中 标题和消息将从调用组件传递到模态 我创建为 DialogService 并添加到 EntryComponents 中 现在我可以显示确认框 但无法得到结果 下
  • 使用 CSS 动画完成后从 DOM 中删除/隐藏 div?

    我有一个动画 其中 div 滑出视图 但是当动画完成时 div 只是返回到其在视图中的原始位置 如何仅使用 CSS 完全删除 div 或在动画结束后隐藏它 这是标记 div class container div class slide b
  • 当父元素具有visibility:hidden时CSS3动画是否运行?

    我有一个 CSS3动画片 https developer mozilla org en docs Web CSS animation定义的 和相关的 keyframes animation myAnimation 2 1s cubic be
  • 如何重置弹性项目的“显示”属性

    我试图通过保留旧浏览器 特别是 IE8 IE9 和 Opera 10 的表格 将基于表格和 JS 的旧布局转换为具有向后兼容性的新 Flexbox 问题是没有display flex item覆盖旧样式display table cell
  • 为什么我可以在css中将gif设置为背景图片url(),但无法将视频mp4设置为背景url?

    为什么我可以在css中将gif设置为背景图片url 但无法将视频mp4设置为背景url 我尝试了一切 甚至将 url 设置为指向 svg 该 svg 中包含在 src 属性中编码为 base64 的异物视频 但行不通 我不需要 video
  • 缩小 HTML、CSS 和 Javascript 是一个坏主意吗?

    维基百科定义缩小 http en wikipedia org wiki Minification 28programming 29 as 从源代码中删除所有不必要的字符而不改变其功能的过程 这些不必要的字符通常包括空格字符 换行符 注释 有
  • 使用 bootstrap 将并排的网格位置交换到顶部和底部

    我有两个 div 内容和图像 它们在中等屏幕中并排放置 col md 6 内容 col md 4 图片 因此 当屏幕尺寸更改为小屏幕和 xs 屏幕时 这些 div 不应该并排放置 它们应该像这样顶部和底部对齐 image content 这
  • Bootstrap 的网格每行列数

    Bootstrap 附带一个 12 列网格系统 必须放置在行内 我的问题是 列数 行数是否必须为 12 或更少 或者我可以有如下所示的布局吗 div class row div class col md 4 div div class co
  • 具有 Universal 和 Ionic 的 Angular SSR 不会在页面源中显示实际数据

    我有一个 nguniversal 的 Angular 11 项目 我的主页正在从内部 翻译键对象 和外部 用于显示链接列表的快速节点服务器 服务获取数据 后端域与前端域地址不同 该网站显示正确 但由于某种原因 当我检查该网站时 最初未加载翻
  • CSS 中的分层图像 - 可以将 2 个图像放在同一个元素中吗?

    假设我在 CSS 中为网页设置背景图像 如下所示 body font size 62 5 Resets 1em to 10px font family Verdana Arial Sans Serif background color 9D
  • 将多个 CSS 文件连接成一个

    将多个 CSS 文件连接成一个 CSS 文件的最佳方法是什么 我想减少以下 进入 简单地做cat css css gt css 1 3
  • 如何使用 github 托管外部 CSS 文件?

    我将 css 上传到 github 然后转到网站上的文件并单击 raw 选项 我尝试将其添加到网页中 但 chrome 给出以下错误 资源解释为样式表 但使用 MIME 类型 text plain 进行传输 https raw github
  • 如何计算一行中Flexbox项目的数量?

    网格是使用 CSS flexbox 实现的 Example http jsbin com jumosicasi edit html css js output 本示例中的行数为 4 因为我出于演示目的固定了容器宽度 但是 实际上 它可以根据
  • Angular 5 服务工作者不工作

    我尝试在更新到 Angular 5 后将 Service Worker 添加到我的项目中 但遇到了一些问题 我将导入添加到 app module ts import ServiceWorkerModule from angular serv
  • Radiobutton-带有纯 html/css 的按钮

    是否可以创建像这样的单选按钮JQuery http jqueryui com demos button radio那些 用纯html css thanks 试试这个小提琴 http jsfiddle net mcXm7 1 http jsf

随机推荐