Angular 9 pinchin pinchout 文本中的 HammerJS 不可选择

Question

大家好，我注意到在组件中使用 (pinchin) 或 (pinchout) 事件时，其中的文本不再可选。 我看到这个问题很久以前已经在hammerjs github页面https://github.com/hammerjs/hammer.js/issues/81中得到纠正。 所以基本上他们说的是使用手势选项https://github.com/hammerjs/hammer.js/wiki/Getting-Started#gesture-options ，特别是一个名为userselect的选项，默认情况下设置为none 。

问题是， hammerjs文档都是针对旧版本的 angular，我不知道如何在新版本中定义这个选项，特别是angular 9 。

这是我的 HTML，正如您所看到的，我在其中显示了一个 pdf，带有一个可选的文本层，这是我希望能够选择文本的层。

<div class="col-xs-12 pdf-viewer-container" (pinchin)="zoomOut()" (pinchout)="zoomIn()">
      <div (swiperight)="previousPage()"></div>
      <pdf-viewer *ngIf="!!pdfData"
                  [src]="pdfData" (after-load-complete)="setNumberOfPages($event)"
                  [render-text]="true" [page]="currentPage" [show-all]="false"
                  [render-text-mode]="2" [zoom]="zoom" [original-size]="false"
                  [autoresize]="true" [stick-to-page]="false">
      </pdf-viewer>
      <div (swipeleft)="nextPage()"></div>
    </div>

当然，如果不使用捏合和捏合，文本选择效果很好。 我需要此功能才能在移动设备中使用手势。

---

我发现这个答案应该这样做delete Hammer.defaults.cssProps.userSelect; 但是我看不出我可以在 angular 9 中做到这一点，因为我没有在我的组件中使用 Hammer 对象，我只是使用指令。

Answer 1

唯一需要做的就是修改名为user-select 的元素 css 选择器，并根据需要将其设置为value = all 或 text 。

这是我的查看器的 css 类：

 pdf-viewer {
            flex: 18 1 90%;
            margin: 30px auto;
            display: block;
            overflow: auto;
            max-width: 90%;
            user-select: text !important;
   }