1

我想在带有 ngx-extended-pdf-viewer 组件（https://www.npmjs.com/package/ngx-extended-pdf-viewer）的对话框中显示 pdf。Pdf 正确显示。现在我的问题是 pdf 查看器本身使用了一些媒体查询。如果宽度小于 700 像素，一些按钮将消失并显示在扩展按钮中。

pdf 查看器的宽度是固定的，因此当媒体变小时它会滚动。所以我不再需要媒体查看器的媒体​​设置。如何在我的 Angular 5 应用程序中禁用它们？

我尝试使用以下代码将封装设置为 viewEncapsulation.None：

@media (max-width : 700px) {
    #outerContainer .hiddenMediumView {
        display: inherit;
    }
}

这是在库中用于获得更小宽度的代码。

@media (max-width: 700px)
#outerContainer .hiddenMediumView {
    display: none;
}
4

1 回答 1

2

2019 年 7 月 17 日更新：我刚刚发布了 ngx-extended-pdf-viewer 1.0.0-rc.1。这个版本应该可以解决你的问题。现在您可以选择两种策略来实现响应式设计：纯 CSS 方法 (set [ignoreResponsiveCSS]="false") 和由 JavaScript 提供支持的方法 (set [ignoreResponsiveCSS]="true")。另外，公寓有一个合理的默认设置。首选 CSS 方法，仅当 PDF 查看器未跨越窗口的整个宽度时才默认选择 JavaScript 方法。例如，如果有侧边菜单，原生的 CSS 规则是没有用的，所以使用 JavaScript 引擎。

原始答案： 哎呀。我是 ngx-extended-pdf-viewer 的作者，我什至没有想到媒体查询可能会妨碍您。雪上加霜的是，我已经开始将媒体查询迁移到 JavaScript，所以即使是臭名昭著的!importanthack 也无济于事。

请在https://github.com/stephanrauh/ngx-extended-pdf-viewer/issues上开票。我的提议：我可以完成将媒体查询迁移到 JavaScript。这反过来又允许我添加一个选项来完全关闭它们。这对你有帮助吗？还有其他想法吗？

于 2019-06-26T21:44:01.687 回答