Question

我有一个CRUD angular 5.5组件，它使用路由参数在各种模式（新，编辑，查看）中自行设置。应该避免嵌套订阅，但是由于我需要一些基本的条件逻辑，因此我不确定该怎么做。

    this.route.params.subscribe((params) => {
       this.action  = params.action;
       if (this.action  === 'new') {
           // get the formation need to make a new item
           this.service.getList().subscribe((data) = > this.list = data);
           // do stuff
       } else { 
           // view or edit a item
           this.service.getItem(params.id).subscribe((data) = > this.item = data);
           // do other stuff
       }
    });

我尝试使用切换映射，但是不确定是否真的好得多，因为现在返回的是复杂类型的observable<item> | observable<item[]>。必须有一种更好的，更具表现力的方式来做到这一点。

this.route.paramMap.switchMap((params: ParaMap) => {
   this.action = params.get('action');
   if (this.action === 'new) {
     return this.service.getList();
   } else {
     return this.service.getItem(params.get('id));
   }
}).subscribe((data) => {
  if (this.action === 'new) {
     this.list = data;
     // do stuff
  } else {
     this.item = data;
     // do other stuff
});

Answer 1

解决此问题的更好方法是更改路由配置。对于CRUD应用，类似这样的方法将起作用：

const routes: Routes = [
  { path: '', component: IndexComponent },
  { path: 'create', component: CreateComponent },
  { path: ':id', children: [
      { path: '', component: ShowComponent },
      { path: 'update', component: UpdateComponent },
      { path: 'destroy', component: DestroyComponent },
    ] 
  }
];

这样，每个组件都可以在API服务上调用适当的方法，而不会产生条件逻辑的开销。

带条件逻辑的嵌套订阅

1 个答案: