Angular ngIf with dynamic generated property

Question

I have app in Angular and in html I have list of posts. Under every post I want to have textarea to add new comment. I want to show/hide this textarea after click button. But I can't do ngIf="someproperty" because after click button all textareas will be shown.

<a href="" (click)="enabledAddComment = true"></a>

<div>
  <div *ngIf="enabledAddComment" class="p-2 form-group">
    <textarea type="text" class="form-control" id="inputCommentBody" placeholder="Text" [(ngModel)]="postCommentModel.body" rows="3"></textarea>
  </div>
  <button>
    Add comment
  </button>
</div>

I want to add to property enabledAddComment postId but how to add postId in typescript file?:

 public enabledAddComment: boolean;

Answer 1

Use the postCommentModel itself. Add a isSelected flag to toggle ngIf condition.