Angular ng类问题,带角度条件?
我有两个链接,分别在单击相应链接时显示两个不同的图像。第一个行为正常,但当我再次单击所选链接时,图像显示正确,但悬停移动到另一个链接。我的意思是它显示的第二个链接被选中。 以下是我到目前为止所做的 有人能帮我做错事吗Angular ng类问题,带角度条件?,angular,angular7,angular-ng-class,Angular,Angular7,Angular Ng Class,我有两个链接,分别在单击相应链接时显示两个不同的图像。第一个行为正常,但当我再次单击所选链接时,图像显示正确,但悬停移动到另一个链接。我的意思是它显示的第二个链接被选中。 以下是我到目前为止所做的 有人能帮我做错事吗 此.toogleClick为真 loadingImg(folder) { this.toggleClick = !this.toggleClick; this.meta .getToken( "images", this.
此.toogleClick
为真
loadingImg(folder) {
this.toggleClick = !this.toggleClick;
this.meta
.getToken(
"images",
this.imgName.ReportJobId,
(folder == "input" ?
this.imgName.UniquePhotoName :
this.imgName.UniquePhotoName
.replace(".JPG", ".png")
.replace(".jpg", ".png")),
folder
)
.subscribe(data => {
this.imgSrc = this.someurl(data);
}, () => {
this.imgSrc = "assets/images/image.jpg";
});
}
<ul class="result__image--tabslist">
<li class="result__image--tab left left__tab" (click)="loadImg('output')">
<span class="result__tab--txt" [ngClass]="toggleClick?'selected':''">
Scan
</span>
</li>
<li class="result__image--tab left" (click)="loadImg('input')">
<span class="result__tab--txt" [ngClass]="toggleClick?'':'selected'">
Original
</span>
</li>
</ul>
加载img(文件夹){
this.toggleClick=!this.toggleClick;
这是梅塔
格托肯先生(
“图像”,
this.imgName.ReportJobId,
(文件夹==“输入”?
this.imgName.UniquePhotoName:
this.imgName.UniquePhotoName
.替换(“.JPG”,“.png”)
.替换(“.jpg”,“.png”),
文件夹
)
.订阅(数据=>{
this.imgSrc=this.someurl(数据);
}, () => {
this.imgSrc=“assets/images/image.jpg”;
});
}
-
扫描
-
起初的
您可以尝试使用
[class.selected]=“toggleClick”
而不是
[ngClass]=“切换单击?”:“选定的”
这样,仅当toggleClick
为true时,才会应用所选的类。您可以尝试:
[class]="toggleClick?'selected':''"
或者
或者
你好风格没有改变。两者都显示为选中状态。您在两个图像上放置了相同的class指令。当然,他们都选择了课程。
[ngClass]="{'selected': toggleClick}"
[class.selected]="toggleClick"