Angular 4隐藏按钮

Question

当我点击第一个按钮时我如何显示第二个按钮并隐藏第一个按钮，并且想要点击第二个按钮然后显示第一个按钮并隐藏第二个按钮

<button class="btn" type="button" name="button" (click)="follow()">follow</button>
<button class="btn" type="button" name="button" (click)="followed()">followed</button>

Answer 1

试试这个

<button class="btn" type="button" [disabled]="!disableBtn" name="button" (click)="follow()">follow</button>
<button class="btn" type="button" [disabled]="disableBtn" name="button" (click)="follow()">followed</button>

在组件

中

export class AppComponent { 
  disableBtn : boolean;
  follow(){
      this.disableBtn = !this.disableBtn;
  }
}

以下是工作 plnker

Answer 2

如果我正确理解了这个问题，我认为更多的是将两个按钮显示/隐藏为启用/禁用它们。

这可能就是我要做的。

<button class="btn" type="button" *ngIf="isVisible" name="button" (click)="toggle()">follow</button>
<button class="btn" type="button" *ngIf="!isVisible" name="button" (click)="toggle()">followed</button>

export class AppComponent { 
    public isVisible: boolean = true;
    toggle() {
        this.isVisible = !this.isVisible;
    }
}