Apollo-Angular with Subscription:模板没有从订阅中获取更改

时间:2017-03-18 21:34:07

标签: angularjs graphql-js apollo-client graphql-subscriptions

我在我的项目中使用apollo-angular + subscriptions-transport-ws。我有客户端设置来收听订阅用户的密码更新或新用户创建事件。这是它的设置方式

//Apollo Subscription
this.apollo.subscribe({
  query: this.passwordUpdatedSubscription
}).subscribe(({passwordUpdated}:any) => {
  return this.userDataQuery.updateQuery((previousResult) => {
    let userIndex = previousResult.getUsers.findIndex(user => user.name === passwordUpdated.name);
    let updatedUsers;
    if (userIndex === -1) {
      updatedUsers = [].concat(previousResult.getUsers).concat([passwordUpdated]);

    } else {
      updatedUsers = [].concat(previousResult.getUsers.slice(0, userIndex)).concat([passwordUpdated]);
      if (userIndex !== previousResult.getUsers.length - 1) {
        updatedUsers = updatedUsers.concat(previousResult.getUsers.slice(userIndex + 1));
      }

    }
    return Object.assign({}, previousResult, {
      getUsers: updatedUsers,
    });
  });

});

它似乎工作正常并且可以通知userDataQuery有关更新的信息。在userDataQuery中,它以这种方式处理更新

this.userDataQuery = this.apollo.watchQuery({
  query: this.getUsersQuery
}).subscribe(({data}:any) => {
  this.userData = data.getUsers;
  // I have to call detectChanges to tell Angular to re-render the template.
  // is there anyway to avoid doing this?
  //this.ref.detectChanges();

});

userData确实已成功更新,但更改未反映在模板上。我必须致电this.ref.detectChanges();来更新模板。

模板很简单

<span ng-if="userData">{{userData && userData[0] && userData[0].password}}    </span>

代码中是否有任何遗漏的内容。我认为模板应该自动获取更改?

0 个答案:

没有答案