【问题标题】:Angular ngx-extended-pdf-viewer disable media print propertiesAngular ngx-extended-pdf-viewer 禁用媒体打印属性
【发布时间】:2019-10-24 20:21:12
【问题描述】:

我想在带有 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;
}

【问题讨论】:

    标签: angular sass ngx-extended-pdf-viewer


    【解决方案1】:

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

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

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

    【讨论】:

    • 现在我自己添加了 GitHub 票证:github.com/stephanrauh/ngx-extended-pdf-viewer/issues/103
    • @ Stephan Rauh Hi Stephan,哪些标签会引起您对ngx-extended-pdf-viewer 的关注?
    • @CatarinaRuna 现在你已经成功了。 :) 你是对的,让我们创建一个标签,以便我可以订阅它!
    猜你喜欢
    • 2021-06-17
    • 1970-01-01
    • 2022-10-20
    • 2020-05-31
    • 2021-10-30
    • 2019-11-10
    • 2019-11-13
    • 2020-02-11
    • 2021-11-05
    相关资源
    最近更新 更多