Angular Apollo writeQuery changed the cache, but UI(subscribe variable) does not

[yyruuu]

I wanna delete a post from a post list. When deleting, I first read the object through readQuery, then make a deep copy, then change the cache through writeQuery. And if I read the cache again, it does change. However, on the page, the value of the subscription variable this.moments$ has not changed, so neither does UI. Can someone help me?

• "apollo-angular": "^1.8.0",
• "apollo-client": "^2.6.8",
• "ionic": "^5.4.16",
• Angular 8.2.14

public async updatePost(updateInput: PostUpdateInput): Promise<Result<PostEntity>> {
    return await getResult<PostEntity>(
      this.apollo.mutate<Mutation>({
        mutation: UPDATE_POST,
        variables: {
          updateInput
        },
        update: (proxy, { data }) => {
          const { postUpd } = data
          if (postUpd) {
            if (updateInput.isDeleted) {
               try {
                const myListCache = proxy.readQuery<Query>({
                  query: SELF_LIST,
                  variables: { userId: postUpd.userId, watchId: postUpd.userId, offset: 0, num: 10 }
                });
                let myCache = JSON.parse(JSON.stringify(myListCache.user.post.postsOfSelf));
                myCache = myCache.filter(i => {
                  console.log(i.id, postUpd.id);
                  return i.id !== postUpd.id
                })
                proxy.writeQuery({
                  query: SELF_LIST,
                  variables: { userId: postUpd.userId, watchId: postUpd.userId, offset: 0, num: 10 },
                  data: {
                    user: {
                      __typename: dataCache.user.__typename,
                      post: {
                        __typename: dataCache.user.post.__typename,
                        postsOfSelf: [...myCache]
                      }
                    }
                  }
                });
               } catch (e) {
                 console.log('something wrong');
               }

            } else {
              this.changePost(postUpd.id, postUpd.userId, (post) => {
                copyAttrs(post, updateInput);
              })
            }

          }
        }
      })
        .pipe(
          map(res => res.data.postUpd)
        )
        .toPromise()
    )
  }

gql

export const SELF_LIST = gql`
query($userId: Int!, $offset: Int, $num: Int){
  user(userId: $userId){
    post{
      postsOfSelf(offset: $offset, num: $num){
        id
        userId
        content
        createdAt
        updatedAt
        editedAt
        userInfo{
          id
          nickName
          photo
        }
      }
    }
  }
}

this variable does not change

    this.moments$ = this.momentsDataService.getSomeonePostList(this.fId, this.baseInfoService.userId, this.momentsPage, 'cache-first');

HTML

<div class="container" *ngFor="let moment of likeMoments$ | async; index as i;">
          <app-saying [moment]="moment" [index]="i"></app-saying>
</div>

[AhmedBHameed]

I confirm this issue with "apollo-angular": "^4.0.1",