是否可以根据条件在Angular中更改按钮的标签?

问题描述

我在表单的各个步骤中都有以下按钮。

<div class="col-2">
 <button class="main-buttton" (click)="increment()" label='Next' type='button' *ngIf="isShownNextButton"> 
 </button>
</div>

在倒数第二个步骤中,我想修改按钮的label指令的值,以便根据ts中的布尔值控件显示其他文本。

是否有可能这样,所以我不必实施另一个按钮并根据我所处的步骤将一个按钮显示给另一个按钮?

提前谢谢

解决方法

您可以使用类似的内容:

HTML

<div class="col-2">
 <button class="main-buttton" (click)="increment()"  type='button'> 
   {{isShownNextButton ? 'Text if true' : 'Text if false`enter code here`'}}
 </button>
</div>

component.ts 在您的组件中,您可以使用一个字段。例如:

@Component()
export class SomeComponent{
  isShownNextButton: boolean= false;
}
,

有什么反对在打字稿控制器中使用标签条件逻辑,而只在html中使用变量吗? <body> <nav class="topbox"> <ul> <li class="leftbox"><a class="active" href="index.html">INOVA</a></li> <div class="flex-navbar"> <li><a class="active" href="about.html">About</a></li> <li><a href="Schedule.html">Innovation Camps</a></li> <li><a href="contact.html">Contact</a></li> </div> </ul> </nav> <div class="container"> <div class="box"> <h1>About Inova</h1> </div> </div> <footer> <div class="footer"> <p></p> </div> </footer> </body>

相关问答

错误1:Request method ‘DELETE‘ not supported 错误还原:...
错误1:启动docker镜像时报错:Error response from daemon:...
错误1:private field ‘xxx‘ is never assigned 按Alt...
报错如下,通过源不能下载,最后警告pip需升级版本 Requirem...