Как настроить правильное отображение тегов?

Question

[Ole89]

Есть лента новостей. У каждой новости имеется список тегов. Он появляется при нажатии на кнопку "Теги", которая находится около каждой из новостей и, соответственно, исчезает при повторном нажатии этой кнопки.

Как мне сделать так, чтобы при нажатии на "Тэги" открывался только список тегов данной новости, а не список тегов для каждой из новостей? Понимаю, что это происходит, так как переменная showNewsTag одна на все новости. Но если отказываться от нее, то как быть с *ngIf тогда?

Код прилагаю.

<div *ngFor="let item of news">
<p> {{item.title}} </p>
<p> {{item.content}} </p>
<span (click)="showNewsTag = !showNewsTag">Теги:</span>
<div *ngIf="showNewsTag">
<div name="tags" *ngFor="let tag of tags">
<span> {{tag.title}} </span>
</div>
</div>
</div>

Answer 1

[0xD34F]

Пусть у каждой новости будет своё свойство, отвечающее за отображение тэгов:

<span (click)="item.showTags = !item.showTags">Теги:</span>
<div *ngIf="item.showTags">

Comments

[Ole89]

Работает, спасибо!