问题描述
我的应用程序渲染了一个对象列表，我使用图像 url 来渲染它。
<app-post *ngFor='let post of posts' [imageUrl]="post.imageUrl"></app-post>
我从这样的商店获取物品：
this.store.pipe(select(selectPosts),takeuntil(this.destroyed$)).subscribe((posts) => {
this.posts = posts;
});
posts 数组看起来像：
[
{id: 112,imageUrl: "http://image1.com/img1.png",status: 'pending'},{id: 113,imageUrl: "http://image1.com/img2.png",status: 'approved'},{id: 114,imageUrl: "http://image1.com/img3.png",status: 'declined'}
]
- 如何正确过滤商店中的对象？我喜欢这个：
filterPostsByStatus(status: string): void {
this.store
.pipe(select(selectPosts),takeuntil(this.destroyed$))
.subscribe((posts) => {
if (status === 'all') {
return (this.posts = posts);
}
return (this.posts = posts.filter((post) => post.status === status));
})
.unsubscribe();
}
这是从商店过滤对象的正确方法吗？
- 更重要的是，每当我这样做时，浏览器每次都会下载图像（我过滤了 50、100 个项目），这会导致对服务器的图像请求数量。 如何过滤对象数组并且在过滤数组时不向服务器发出图像请求？
附言我看到 cache-control: max-age=0 来自服务器的图像。这可能是浏览器每次都下载它们的原因吗？
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）