Скрыть таблицу с помощью ngOnInit

Question

Мне нужно скрыть определенный столбец в таблице HTML при загрузке страницы. Я использовал ngOnInit (), чтобы скрыть столбец. Но это работает только для <th>, а не для <td>.

Но, когда я использовал функцию щелчка, она работает как для <th>, так и для <td>. Как мне этого добиться?

это мой код, используемый в ngOnInit

ngOnInit() {
$('td:nth-child(19),#tr1 th:nth-child(8)').hide();
}

Answer 1

Вы должны сделать конкретный столбец зависимым от логического элемента, используя ngIf. Например:

// ----- component.html -----
<table style="width:100%">
  <tr>
    <th>column1</th>
    <th>column2</th> 
    <th *ngIf="!eliminar">columnInvisible</th>
  </tr>
  <tr>
    <td>1</td>
    <td>2</td> 
  </tr>
  <tr>
    <td>3</td>
    <td>4</td> 
  </tr>
</table>

// ------ component.ts ------
export class LoginViewComponent implements OnInit {

  eliminar: boolean;

  ngOnInit() {
    this.eliminar = true;
  }

}