angular - 如何在按角度 6 的按钮时更改事件?
问题描述
每个人。我刚开始学习 Angular 6,我有一个问题。我需要当按下按钮时,不仅按钮的文本会发生变化,而且事件也会发生变化,这应该在按下按钮时发生。例如,第一次单击按钮会将组件添加到内存中,第二次单击此按钮将删除。
这是我的 HTML 代码:
<button class="btn" (click)="toggleEvent()">
{{addToMemory ? 'Add to memory' : 'Delete from memory'}}
</button>
来自 TS:
addToMemory: boolean = true;
toggleEvent(): void {
this.addToMemory = !this.addToMemory;
}
我有一个功能可以将电影添加到内存并删除。
add() {}
delete() {}
但我不明白如何通过在这些功能之间单击来切换按钮。请解释和帮助。我找到的或不起作用的示例,或者不清楚如何应用它们。对不起,我的英语不好。
解决方案
您的 HTML 部分:
<button class="btn" (click)="toggleEvent()">
{{addToMemoryFlag ? 'Add to memory' : 'Delete from memory'}}
</button>
你的 TS 部分:
addToMemoryFlag: boolean = true;
toggleEvent() {
this.addToMemoryFlag = !this.addToMemoryFlag;
if(this.addToMemoryFlag) {
this.addToMemory();
} else {
this.deleteFromMemory();
}
}
最好区分
addToMemory
变量和addToMemory()
方法的名称,更改变量或方法的名称。
推荐阅读
- android - 如何用Android RecyclerView表示列表里面的列表
- google-apps-script - 创建 Google 脚本以将表格中的值复制到表格的单独选项卡上的不同表格中
- kubernetes - kubernetes 部署一个带有版本化密钥的 pod
- r - 计算复杂 table_1 中的持续时间
- html - 简单标签图像库(CSS + jQuery)的不透明度问题
- arrays - python中的枚举和范围(len(list))有什么区别?
- amazon-web-services - 部署 cloudformation 模板时指定 S3 存储桶
- python - 从包内的文件夹访问自制包,python
- java - 有没有办法让可执行/可运行的 jar 文件读取可以手动编辑的 yml 文件?
- linux - 如何降低页面分配失败的概率?