How to hide text when button click

Question

I'm trying to hide this note text that located above my text editor when user click any edit icon but some reason it hide for the first time but when the user click the same or different edit icon, the text appear again. how can I make that text always disappear when the user click at any edit icon at anytime.

so it's happening like text appear, disappear, appear, disappear every time I click any edit icon.

<button mat-icon-button color="primary" matTooltip="Edit documents for this Subsection"
  (click)="editDoc(subsection)"></button>

<p *ngIf="isShown">Note: Click edit icon to start editing the documentation</p>

<ng-container  *ngIf="subsectionToEdit && !refreshEditor">
     <angular-editor [(ngModel)]="subsectionToEdit.text" [config]="editorConfig"></angular-editor> 
</ng-container>

  isShown: boolean = true ;

  editDoc(value) {
    this.selectedId = value.id
    this.subsectionToEdit = value;
    this.refreshEditor = false;
    this.isShown = !this.isShown;
  }

Answer 1

This line of code is simply toggling the visibility of the text:

this.isShown = !this.isShown;

So first click sets it to false, second sets it to true, third sets it to false, etc as !false === true and !true === false. If you want it to hide whenever the edit button is clicked just use:

this.isShown = false;