如何在按钮单击事件 Angular 4 后更改文本值

Question

单击此按钮的事件后(下面的代码(

<button (click)="login()" routerLink="/dashboard" class="btn btn-primary 
primary-login">Login with Google</button>

我想将标题 h1 中的文本值更改为例如仪表板

<h1 class="oap__header--title"  >Welcome in Organizer App</h1>

下面是打字稿代码

login() {
this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
}

有谁知道如何实现这一目标？？可能这真的很容易，但我不知道如何从这个问题开始

Answer 1

不要在HTML 中对字符串进行硬编码，请使用组件的属性，如下所示：

<h1 class="oap__header--title">{{ myString }}</h1>

在 TS 文件中，你将拥有：

myString: string = 'Welcome in Organizer App'
login() {
this.myString = 'Dashboard'
this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
}