angular – 如何使用graphql变异自动刷新Apollo Client正在监视

我在graphQL之上构建了一个Web服务,它运行得很好.我面临的唯一问题是项目的客户端.例如(请参阅下面的代码),在运行createVideo()后,我的组件的数据属性是一个可观察的,它正在观察查询不会自动刷新并且在回调上手动调用apollo.query似乎不需要任何影响,因为查询返回缓存的结果,而不是服务器的结果.

我错过了什么吗？

app.component.ts
  import {Component,OnInit} from '@angular/core';
  import {Apollo,ApolloQueryObservable} from 'apollo-angular';
  import 'rxjs/Rx';
  import gql from 'graphql-tag';

  // http://dev.apollodata.com/angular2/mutations.html
  const NewVideoQuery = gql`
    mutation AddVideoQuery($title: String!,$duration: Int!,$watched: Boolean!){
      createVideo(video: { title: $title,duration: $duration,watched: $watched } ){
        id,title
      }
    }
  `;
  const VideoQuery = gql`
      {
          videos {
              id,title
          }
      }
  `;
  @Component({
    selector: 'app-root',templateUrl: './app.component.html',styleUrls: ['./app.component.css']
  })
  export class AppComponent implements OnInit {
    data: ApolloQueryObservable<any>;
    video: any = {};

    constructor(private apollo: Apollo) {
    }

    ngOnInit() {
      this.data = this.apollo.watchQuery({query: VideoQuery});
    }

    createVideo() {
      /**
       * This will send a mutate query to the server.
       */
      // @todo After running the mutate,the watch query doesn't refresh
      this.apollo.mutate({
        mutation: NewVideoQuery,variables: {
          'title': this.video.title || 'Some Video' + Math.floor(Math.random() * 10),'duration': 123213,'watched': true
        }
      }).subscribe((afterMutation) => {
        console.log(afterMutation);
        // This fires but query doesn't hit the server since it's coming from cache.

        // @todo Not even by re-running it here
        this.apollo.query({query: VideoQuery})
          .subscribe((data) => {
            console.log(data);
          });
      },(err) => alert(err));
    }
  }

//app.component.html

  <div *ngFor="let x of data | async | select: 'videos'">
   <div><b>{{x.id}}</b>{{x.title}}</div>
  </div>

  <label>
    Title
    <input type="text" [(ngModel)]="video.title">
  </label>

  <button (click)="createVideo()">{{title}}</button>