javascript - 角度分配变量到链接
问题描述
在我的应用程序中,单击按钮时,我通过链接显示图像。当前,显示句子“Hello World”。但我想_stickerData?.stickerData
通过链接显示我自己的数据。我怎样才能达到我想要的?
HTML;
<button mat-button matRipple class="purple-500 fuse-white-fg mr-12" (click)="imageSource()">Display Image </button>
<img [src]="url" *ngIf="hidden" />
TS;
public _stickerData: IStickerData = {};
hidden = false;
url = "http://api.labelary.com/v1/printers/8dpmm/labels/4x6/0/^xa^cfa,50^fo100,100^fdHello World^fs^xz";
@Input()
set StickerData(prm: IStickerData) {
if (this._stickerData != prm) {
this._stickerData = prm;
}
}
get StickerData(): IStickerData {
return this._stickerData;
}
imageSource(){
this.hidden = !this.hidden;
}
解决方案
您可以通过使用 ${} 运算符插入 @Input 设置器中的 url 来更新它:
public stickerData: IStickerData;
hidden = false;
url;
@Input()
set StickerData(prm: IStickerData) {
if (this.stickerData !== prm) {
this.stickerData = prm;
}
this.url = `http://api.labelary.com/v1/printers/8dpmm/labels/4x6/0/^xa^cfa,50^fo100,100^fd${this.stickerData?.stickerData}^fs^xz`;
}
get StickerData(): IStickerData {
return this.stickerData;
}
imageSource(): void{
this.hidden = !this.hidden;
}
推荐阅读
- javascript - 使用 Angular 12 使用 js-xlsx 读取本地 Excel 文件?
- specifications - Jolt 组合在一起并包含新标签
- javascript - React:如何将参数传递给父组件
- android - 如何制作可点击的ListView
- sql - 如果某个字段存在,则表的动态联合
- excel - 检查文件夹中是否存在文件后如何将文本写入单元格?
- javascript - 使用画布在spreadJS上进行赛普拉斯测试
- java - Consistency of return type
- .net-core - 包含在 .NET Core 中的循环引用
- r - 在这种情况下如何使用连接?