我列出了陣列中的一些影像，當前影像具有橙色邊框。當用戶單擊影像時，它成為當前影像，但單擊前一個當前影像的邊框消失，但包含 orage 邊框的類不適用于更新的當前影像
為什么角度沒有檢測到這個變數變化？
我的 html 代碼：
<div class="product-thumbnail-box">
<ng-container *ngFor="let thumb of thumbnails; let index = index">
<div
[ngStyle]="{ background: 'url(' thumb ')' }"
class="thumb"
[ngClass]="{ 'thumb-active': thumb === currentThumbnail }"
(click)="choosePicture(index)"
></div>
</ng-container>
</div>
我的 component.ts 代碼：
constructor(private cd: ChangeDetectorRef) {}
showLightBox = false;
images = [
'assets/images/image-product-1.jpg',
'assets/images/image-product-2.jpg',
'assets/images/image-product-3.jpg',
'assets/images/image-product-4.jpg',
];
thumbnails = [
'assets/images/image-product-1-thumbnail.jpg',
'assets/images/image-product-2-thumbnail.jpg',
'assets/images/image-product-3-thumbnail.jpg',
'assets/images/image-product-4-thumbnail.jpg',
];
currentImage = this.images[0];
currentThumbnail = this.thumbnails[0];
choosePicture(index: number) {
this.currentImage = this.images[index];
this.currentThumbnail = this.currentThumbnail[index];
this.cd.detectChanges();
}
uj5u.com熱心網友回復：
其實你拼錯了你的陣列變數名
取而代之的是您選擇圖片方法中的這一行
this.currentThumbnail = this.currentThumbnail[index];
添加這一行
this.currentThumbnail = this.thumbnails[index];
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/537241.html