NG级问题与角度条件?

Question

我有两个链接，单击各自的链接时显示两个不同的图像.第一个行为很好，但是当我再次单击所选链接时，图像显示正确，但悬停移动到另一个链接。我的意思是它显示已选择的第二个链接。 这是我到目前为止所做的。

有人可以帮助我做错什么吗？

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>

Answer 1

你可以试试

[class.selected]="toggleClick"

而不是

[ngClass]="toggleClick?'':'selected'"

这样，仅当toggleClick为 true 时，才会应用selected类。

Answer 2

你可以试试：

[class]="toggleClick?'selected':''"

或

[ngClass]="{'selected': toggleClick}"

或

[class.selected]="toggleClick"