How to configure the correct display of tags?

Question

Angular

There is a news feed. Each news has a list of tags. It appears when you click on the "Tags" button, which is located next to each of the news and, accordingly, disappears when you click this button again.
How can I make it so that clicking on "Tags" opens only the list of tags for the given news item, and not the list of tags for each of the news items? I understand that this is happening, since the showNewsTag variable is the same for all news. But if you refuse it, then what about *ngIf then?
I am attaching the code.

<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

Let each news have its own property responsible for displaying tags:

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