Сделайте стоп-заголовок и первый столбец таблицы, используя Angular @HostListener - PullRequest
Новая
       25

Сделайте стоп-заголовок и первый столбец таблицы, используя Angular @HostListener

0 голосов
/ 02 мая 2019

Мне нужно заморозить заголовок и первый столбец таблицы.

У меня есть ТАБЛИЦА внутри DIV с css class = xyscroll. «xyscroll» предоставляет горизонтальную и вертикальную полосу прокрутки, используйте эту полосу прокрутки, чтобы перемещать таблицу по оси X-Y. ниже кодовой дозы успешно,

но я не могу заморозить заголовок и первый столбец. Нужна помощь по этому, (Angular 4) 

   <div class="xyscroll"><table></table></div> // html code
   .xyscroll{width:400px, height:400px, overflow:auto} // css code

Код таблицы: 

   <table>
     <thead>
       <tr><th rowspan=2>H11</th><th colspan=4>H12</th></tr>
       <tr><th>H22</th><th>H23</th><th colspan=2>H24</th></tr>
       <tr><th>H31</th><th>H32</th><th>H33</th><th>H34</th><th>H35</th
     </tr>
     </thead>
     <tbody>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td> 
    </tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
       <tr><th>D11</th><td>D12</td><td>D13</td><td>D14</td><td>D15</td></tr>
     </tbody>
   </table>
...