Question

在Angular8中，我有一个页面，其中列出了一些信息，并且在从当前页面删除行后有删除选项，我需要刷新当前页面以便内容可以更新。我已经为此使用了导航功能，但由于页面导航问题而无法使用

下面是我删除记录的代码

deleteBusiness(id) {    
    this.bs.deleteBusiness(id).subscribe(
      res =>{console.log(res)},
      error=>console.log(error.message),
      ()=>{this.router.navigate(['business'])}
    );    
  }

我在定义的记号中使用了onSameUrlNavigation，但是它不起作用。请让我知道这里错过了什么下面是我的路线配置

const routes: Routes = [
  {
    path: 'business/create',
    component: GstAddComponent
  },
  {
    path: 'business/edit/:id',
    component: GstEditComponent
  },
  {
    path: 'business',
    component: GstGetComponent,
    runGuardsAndResolvers: 'always'
  },
  {
    path: '',
    redirectTo: "/business",
    pathMatch :"full"
  },
];

我已使用以下链接排除了此问题

Angular 6 router link issue in the same page

但是没有成功。请提出一种解决方法

Answer 1

您不必重新加载页面即可刷新数据。自从AJAX发明以来！删除承诺解决后，调用加载数据的函数。

deleteBusiness(id) {    
    this.bs.deleteBusiness(id).subscribe(()=>{
         this.loadData();
    });    
  }

Answer 2

window.location.reload();这会重新加载整个页面，但是最好不要只是为了更新值而这样做，您可以通过拼接array.splice(index_value,1);从数组中删除该值，或者只调用保存结果的api

Answer 3

deleteBusiness(id) {    
 this.bs.deleteBusiness(id).subscribe( (err,res) => {
   if(err){ /* Do Something */ }
   else{  
          /* Here call the function which fetch this list like */  
       this.functionName();
   }
 });    
}

Answer 4

我需要刷新当前页面，以便内容可以更新

我认为进行刷新以更新要删除的数据可能并不理想。

我将从阵列中构建的dataset activate orig. /* or just open the original data. add files /file=* /keep= !myvarlist .中删除已删除的数据。假设这称为业务，是一个数组。

*ngFor

这将确保视图与删除的项目保持最新，然后在页面最终刷新时，不会再次加载删除的数据。如有任何问题，请发表评论。

approach

.findIndex()

Answer 5

router.navigate（）函数仅在URL发生更改时被调用。您需要做的是获取响应，如果响应为SUCCESS，则触发getAll调用。

//假设您具有获取所有数据的功能。

deleteBusiness(id) {    
    this.bs.deleteBusiness(id).subscribe(
      res =>{this.getAll()},
      error=>console.log(error.message),
      ()=>{this.router.navigate(['business'])}
    );    
  }

//如果不存在，则定义getAll（）

执行操作后导航到同一页面

5 个答案: