我正在做一个教程,我已经达到了可以无缝创建产品的部分,但是当我去更新同一个产品时,图像没有更新,即使我不改变它,它也会出现空白。
下面是组件TS文件:
private _checkEditMode() {
this.router.params.subscribe((params) => {
if (params['id']) {
this.editMode = true;
this.currentProductId = params['id'];
this.productsService
.getProduct(params['id'])
.subscribe((product) => {
...
...
this.imageDisplay = product.image ; // I FEEL LIKE THERE IS SOMETHING WRONG WITH THIS LINE,
...
...
});
}
});
}
下面是服务ts代码:
export class ProductsService {
apiURLProducts = environment.apiUrl + 'products';
updateProduct(productData: FormData, productid: string): Observable<Product> {
return this.http.put<Product>(`${this.apiURLProducts}/${productid}`, productData);
}
}
下面是HTML:
<tr>
...
...
<td style="width: 15%;"><img [src]="product.image" style="width: 100%" alt="" /></td>
...
...
</tr>
有人建议我定义“产品。图片”,如果是这样的话,我该怎么做呢?谢谢。
1条答案
按热度按时间wvmv3b1j1#
您的HTML不知道
product
,因为它是subscribe方法的私有参数。但是根据我的理解,当您将
product.image
放入this.imageDisplay
时,您应该将src
绑定到imageDisplay
<img [src]="imageDisplay" style="width: 100%" alt="" />
假设服务工作正常,并且imageDisplay是组件的公共成员