Question

执行操作后，我一直在尝试显示成功消息并刷新页面。假设当我执行删除操作时，后端的响应应该显示在页面上并在之后刷新。我该怎么办呢？

reloadGame() {
   this.gameService.getAllGames().subscribe(data => {
      console.log(data)
   })
}

removeGame(game) {
   this.httpService.deleteGame(game.id).subscribe(data => {
      this.reloadGame()
   })
}

Answer 1

private Games:any = [];   //assuming your have an array called Games

您需要将服务返回的响应设置为绑定到HTML的变量。

reloadGame(){
 this.gameService.getAllGames()
  .subscribe(data => {
    this.Games = data;       <== You have not set the response to your Games array
    });
}

这应该适用于以下HTML

<table>
    <tbody>
        <tr *ngFor="let game of Games; let i = index">
         <td>{{i + 1}}</td>
         <td>{{game.name}}</td>
         <td>{{game.type}}</td>
        </tr>
    </tbody>    
</table>

Answer 2

你可以有一个消息字符串在this.reloadGame（）之前为它分配订阅消息，并在reloadGame的订阅中再次使其为空。

和html

<div *ngIf="message" class="success">{{message}}<div>

Answer 3

我知道距您发布问题已经很久了，但是我希望这可以帮助需要相同解决方案的其他人...无论如何...

只需放置诸如location.reload（）;之类的javascript代码；或者如果您想使用角度样式，则只需输入this.ngOnInit（）;在您要重新加载/刷新页面的ts文件中。

reloadGame() {
   this.gameService.getAllGames().subscribe(data => {
       console.log(data)
       location.reload();  //Add this line to your code option 1
       this.ngOnInit();    //or you could add this also as option 2 instead using option 1
   })
}

removeGame(game) {
   this.httpService.deleteGame(game.id).subscribe(data => {
       this.reloadGame()
   })
}

如何在角度2中成功消息后刷新页面

3 个答案: