单击按钮时如何隐藏文本

Question

当用户单击任何编辑图标时，我试图隐藏位于我的文本编辑器上方的注释文本，但由于某些原因它第一次隐藏，但是当用户单击相同或不同的编辑图标时，文本出现再次。当用户随时单击任何编辑图标时，如何使该文本始终消失。

因此每次我单击任何编辑图标时，文本都会出现、消失、出现、消失。

<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.isShown = !this.isShown;

因此，第一次点击将其设置为 false，第二次点击将其设置为 true，第三次点击将其设置为 false，以此类推，如 !false === true 和 !true === false。如果您希望它在单击编辑按钮时隐藏，只需使用：

this.isShown = 假；

单击按钮时如何隐藏文本

How to hide text when button click

html

css

hide

typescript

angular