服务不刷新数组
Service doesnt refresh array
所以我有一组服务中的对象,我从 api 中获取这些对象。我已经制作了通过单击按钮删除其中一个元素的方法。它有效,但为了让网站刷新,我需要重新加载它,不应该这样。当我发送删除请求时,我过滤数组,这样我就不必再次从 API.
获取数组
deleteCustomer(id: number) {
this.tokenFromLS = `${localStorage.getItem('token')}`;
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
Authorization: 'Basic ' + this.tokenFromLS,
}),
};
this.http
.delete<void>(`http://127.0.0.1:8080/api/customer/${id}`, httpOptions)
.subscribe(()=>
{
this.customerList = this.customerList.filter((v) => v.id != id);
});
}
在我的组件中,我首先删除资源,然后刷新我的数组。删除它并从服务中检索后,它应该没有我删除的元素。当我记录数组的大小时,它说 0,但是当我记录数组的元素时,它说该元素在那里。我对发生的事情感到困惑
export class GetCustomerListComponent implements OnInit {
constructor(private customerService: CustomerServiceService) {}
customerList: CustomerDto[] = this.customerService.getCustomerList();
ngOnInit(): void {}
deleteCustomer(id: number) {
this.customerService.deleteCustomer(id)
this.customerList = this.customerService.getCustomerList();
console.log(this.customerList.length);
}
}
您应该从组件本身而不是从服务订阅。服务应仅包含 api 逻辑。
只需return服务中的httpresponse并在组件内部订阅即可。
所以我有一组服务中的对象,我从 api 中获取这些对象。我已经制作了通过单击按钮删除其中一个元素的方法。它有效,但为了让网站刷新,我需要重新加载它,不应该这样。当我发送删除请求时,我过滤数组,这样我就不必再次从 API.
获取数组 deleteCustomer(id: number) {
this.tokenFromLS = `${localStorage.getItem('token')}`;
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
Authorization: 'Basic ' + this.tokenFromLS,
}),
};
this.http
.delete<void>(`http://127.0.0.1:8080/api/customer/${id}`, httpOptions)
.subscribe(()=>
{
this.customerList = this.customerList.filter((v) => v.id != id);
});
}
在我的组件中,我首先删除资源,然后刷新我的数组。删除它并从服务中检索后,它应该没有我删除的元素。当我记录数组的大小时,它说 0,但是当我记录数组的元素时,它说该元素在那里。我对发生的事情感到困惑
export class GetCustomerListComponent implements OnInit {
constructor(private customerService: CustomerServiceService) {}
customerList: CustomerDto[] = this.customerService.getCustomerList();
ngOnInit(): void {}
deleteCustomer(id: number) {
this.customerService.deleteCustomer(id)
this.customerList = this.customerService.getCustomerList();
console.log(this.customerList.length);
}
}
您应该从组件本身而不是从服务订阅。服务应仅包含 api 逻辑。
只需return服务中的httpresponse并在组件内部订阅即可。