加载 2 个不同的 json 角度路由器

如何解决加载 2 个不同的 json 角度路由器

我有一个通过服务调用的 json，我在 component.ts 中调用它，然后在我的 html 中对其进行循环，一切正常，但我希望当我点击一个元素时，我有一个我通过路由方法检索的参数显示了不同的 json。

我的问题是：如何在点击项目时加载另一个 json 文件？

两个json路径是：

'./assets/json/one/first.json'

'./assets/json/two/second.json'

第一个 json // 目前我正在加载这个 json

{
      "flags": [
       {
        "name": "one","libelle": "test"
       }
      ],}

第二个json

{
  "flags": [
   {
    "name": "two","libelle": "test 2"
   }
  ],}

服务

private url1 = './assets/json/one/first.json'

constructor(private http: HttpCient) {}

get(): Observable<Itoto[]> {
return this.http.get<Itoto[]>(this.url1);
}

ts.file

public exampleArray: any = [] 


 getALL() {
  this.totoService.getAll().susbcribe(result => {
   this.exampleArray= result
     });
    }

route(name:string) {
 this.router.navigate(['/homepage',(name)]);
 console.log('name);
}

routing.module

const appRoutes: Routes = [
 {
   path: 'homepage/:name',component: FooComponent
 }
]

html

 <div *ngFor=" let toto of exampleArray.flags">
     {{toto.libelle}}
   <span (click)="route(toto.name)">click</span>
 </div>