Question

这是我的问题。

我有一个组件，用户可以点击收藏夹按钮。该操作将存储在数据库中，它将更新＆＃34;最喜欢的＆＃34;柱。关键是，为了更新该值，我从数据库中获取它，我这样做： - 我在组件构造函数中执行get服务以检索特定帖子的所有数据（名称，描述，用户，收藏夹......）。 - 我将收藏列中的值赋给变量。 - 当我单击收藏夹按钮时，我将一个加到该变量（变量+ 1），然后将其发送到Web服务。

数据在数据库中正确更新，但如果我再次按收藏夹按钮，则会在数据库中插入相同的值，因为angular不会刷新我从服务中获取的数据。它更新组件中数据的唯一方法是使用页面刷新，但这不是我想要的......

这是我的代码：

service.ts

updateFav (id: any, variable: any): Observable<any> {
    return this.http.put(`${this.baseUrl}updatePublicacion/${id}/`, variable, {headers: this.getHeaders()})
                     .map((res:Response) => res.json())
                     .catch((error:any) => Observable.throw(error.json().error || 'Server error'));
}

component.ts

@Component({
  selector: 'publicacion-individual',
  providers: [CynomysService],
  templateUrl: './publicacion-individual.component.html',
  styleUrls: ['publicacion-individual.component.css']
})
export class PublicacionindividualComponent implements OnInit {

    idRecibido: any;
    publicacionRecibida: Publicacion;
    favoritos: any;
    favToAdd: any;
    response: any;
    errorMessage: any;

    constructor (private cynomysService: CynomysService, private route:  ActivatedRoute, private _router: Router ){
        this.cynomysService.getPublicacionById(this.route.snapshot.params['id']).subscribe((p) => {this.publicacionRecibida = p});
    }

    ngOnInit() {

    }

    addFavorite() {
        this.favoritos = this.publicacionRecibida[0].favoritos;
        this.idRecibido = this.publicacionRecibida[0].idPublicaciones;
        this.cynomysService.updateFav(this.idRecibido, (this.favoritos + 1)).subscribe(
            result => this.response = result,
            error => this.errorMessage = <any>error
            );
    }


}

我想我需要做些什么，但我真的不知道自从我在Angular中成为新人之后......

我试着尽可能地清楚，但问我是否对我的解释不了解。

Answer 1

您的this.publicacionRecibida似乎在更新后未更新。

如果您可以控制服务器端，那么让它在您的update服务上返回可能是件好事。如果没有，您需要在更新后再次致电this.cynomysService.getPublicacionById：

this.cynomysService.updateFav(this.idRecibido, (this.favoritos + 1))
  .flatMap(
    result => {
      this.response = result;
      //call the get again to refresh your data;
      return this.cynomysService.getPublicacionById(this.route.snapshot.params['id']);
    })
  //final processing
  .subscribe(
    result => {}, 
    error => this.errorMessage = <any>error,
    ()=>{});

如何在更新数据库之前从服务中检索数据（angular2）？

1 个答案: