Javascript 单击更改按钮上的文本

我正在使用Angular 7，每次单击按钮时，我都想更改按钮上的文本，无论是登录还是注销

我把我的代码放在下面：

ts文件：

export class HeaderComponent implements OnInit {

  text: any;

  constructor() {
    this.loadDataFromApi();
  }

  ngOnInit() {
      if (this.token == null) {
        this.text == 'login';
        alert(this.text);

      } else if (this.token) {
         this.token == 'logout';
         alert(this.text);
      }
   }

}

即将发出未定义的警报

html文件：

 <button type="button"> {{text}}</button>

{{text}

您使用的是比较运算符（

=

），而不是赋值运算符（

=

）。改变这一点，它应该工作得很好。大概是这样的：

export class HeaderComponent implements OnInit {

  text: any;

  constructor() {}

  ngOnInit() {
    this.loadDataFromApi();
    if (this.token) {
      this.text = 'logout';
      alert(this.text);
    } else {
      this.text = 'login';
      alert(this.text);
    }
  }
}

---

PS:

此.loadDataFromApi

本质上很可能是

异步的，此调用下面的代码将在不等待的情况下执行，从而导致意外行为。因此，在大多数情况下，您都会在警报中获得
登录
。
您应该使用赋值
=
运算符，而不是比较
=
运算符

this.text ='login';

 export class HeaderComponent implements OnInit {

    text: any;
    constructor( );

        this.loadDataFromApi();
      }
    ngOnInit() {

        if(this.token == null){
          this.text ='login';
          alert(this.text);

        } else if (this.token){
          this.token = 'logout';
          alert(this.text);

        }
    }

尝试，而不是
this.token==null
try
！this.token
（此项检查是否存在未定义项以及空值，并以建议的方式执行）

在
else
之后，您正在修改
this.token
而不是
this.text

此外，您应该使用
=
，而不是
=
来分配
此.text
。更改代码如下：

ngOnInit() {
    if (this.token === null) {
        this.text = 'login';
        alert(this.text);

    } else if (this.token) {
        this.text = 'logout';
        alert(this.text);
    }
}

PS：您的
标记
变量在哪里定义？我在你的
.ts
文件中看不到它。
基本上，你是在检查auth token是否存在，然后你将文本作为注销，而token不是他们的显示登录

在您的情况下，似乎this.token未定义为默认值

这就是为什么在警报中显示未定义

有两个条件行不通

应该是

if (this.token) {//The user is logged in so log out should show.
    this.text = 'logout';
    alert(this.text);

  } else {//The user is logged out  in so login should show
     this.token == 'logout';
     alert(this.text);
  }

请首先检查this.token的值，无论该值是否已设置。
在ts文件中声明了token，似乎缺少token变量。this.token=='logout'；是输入错误，它应该是this.token='logout'；你能尝试一下解决方案为什么双（=）等于赋值吗？我尝试过你的解决方案，但仍然得到未定义的ngOnInit（）{if（this.token==null）{alert（1）；this.text='login'；alert（this.text）；}else if（this.token）{alert（'2'）；this.token='logout'；alert（this.text）；}@TestingAnurag，检查更新的答案。您在
else
条件下使用了
this.token
而不是
this.text
。我尝试使用您的解决方案，但仍然得到未定义的ngOnInit（）{if（this.token==null）{alert（1）；this.text='login'；alert（this.text）；}else if（this.token）{alert（'2'）；this.token='logout'；警报（this.text）；}
if (this.token) {//The user is logged in so log out should show.
    this.text = 'logout';
    alert(this.text);

  } else {//The user is logged out  in so login should show
     this.token == 'logout';
     alert(this.text);
  }