Как изменить класс div с помощью ngClass - PullRequest
Новая
       12

Как изменить класс div с помощью ngClass

0 голосов
/ 16 января 2019

У меня есть тег кнопки, после нажатия на что, он должен изменить класс тега div. Я использую ngFor, поэтому каждая строка должна обрабатываться индивидуально.

Вот фрагмент моего кода и то, что я хочу сделать. 

  <div *ngFor="let item of users">
  <button class="fas fa-angle-up"></button>
  <strong>NAME </strong>{{item.attribute.name}}
  <div class="pf-m-expanded">Some Content Here</div> <!--This is the class that has to toggle upon clicking that **button**>
  </div>

Что я хочу сделать, так это то, что после нажатия кнопки я смогу переключать (удалять и активировать класс) pf-m-expanded. А поскольку это *ngFor, должно обрабатывать каждую строку отдельно .

1 Ответ

0 голосов
/ 16 января 2019

Вы можете определить локальную переменную внутри цикла и иметь кнопку для переключения значения переменной, затем иметь [ngClass], чтобы добавить / удалить класс на основе значения переменной. 

<div *ngFor="let item of users; let toggle = true;">
  <button class="fas fa-angle-up" (click)="toggle = !toggle">Test</button>
  <strong>NAME </strong>{{item.attribute.name}}
  <div [ngClass]="{ 'pf-m-expanded': toggle }">
    Some Content Here
  </div>
</div>
...