Angular CDK Virtual Scrolling - текст в таблице размыт в IE11 - PullRequest
Новая
       11

Angular CDK Virtual Scrolling - текст в таблице размыт в IE11

0 голосов
/ 02 апреля 2020

Я использую Angular 7 и angular / cdk ver 7.3.7. Я создал примерно ту же таблицу, что и в этом уроке: https://www.thecodecampus.de/blog/virtual-scrolling-in-angular-7/

Хотя текст в таблице кажется четким в Chome и Edge, в IE11 он выглядит размытым.

Кто-нибудь знает, почему это происходит или как это исправить?

Спасибо за помощь.

Вот таблица: 

<cdk-virtual-scroll-viewport itemSize="24" class="cdk-content">
 <table class="list">
  <thead>
   <tr>
    <th>HEADER1</th>
    <th>HEADER2</th>
    <th>HEADER3</th>
    <th>HEADER4</th>
   </tr>
 </thead>
 <tbody>
  <ng-container *cdkVirtualFor="let rec of record_list;">
    <tr>
      <td>{{rec.item1}}</td>
      <td>{{rec.item2}}</td>
      <td>{{rec.item3}}</td>
      <td>{{rec.item4}}</td>
    </tr>
   </ng-container>
  </tbody>
 </table>
</cdk-virtual-scroll-viewport>

1 Ответ

0 голосов
/ 26 апреля 2020

Исправлено путем добавления свойства css, как показано ниже. 

.cdk-content{
 ...
 transform : none;
 ...
}

Значение преобразования cdk-virtual-scroll-viewport по умолчанию установлено на translateZ (0px), что делает текст размытым.

...