Question

问题

因此，我对Angular并不陌生，但很快就加快了步伐。我希望Angular在路由功能方面具有动态性。因此，我为Angular创建了一个小型api来联系返回数组。当我遍历数组时，将其内容加载到路由模块中时不会应用其内容。但是，如果我使用相同的方法来加载硬编码的路由，它确实可以工作！

当我定位URL：cms / bla或cms / dashboard时，它可以工作，但其他URL无法识别。 [i] ['path']是一个字符串。例如。 cms / login角度的字符串之一返回未找到。我在这里想念东西吗？

当我查看控制台时，它显示给我：（3）[{…}，{…}，{…}]，当我打开其内容时，所有的路由都在那儿，包括最底端的硬编码。

这是我的代码

output = subprocess.check_output("<your command>")
print(output)

更新＃1

import { ApiResult } from './objects/api';

import { DashboardComponent } from './dashboard/dashboard.component';

import { NgModule } from '@angular/core';
import { RouterModule, Routes, } from '@angular/router';

import { environment } from '../environments/environment';

const routes: Routes = prepareRoutes();

function prepareRoutes() {
  const newRoutes: Routes = [{path: 'cms/bla', component: DashboardComponent}];
  newRoutes.unshift({path: 'bla', component : DashboardComponent});
  newRoutes.unshift({path: 'cms/dashboard', component : DashboardComponent});

  fetch(environment.apiUrl + '/routes/').then((value: Response)  => {
    return value.json();
    }).then((routeResults: ApiResult) => {
    for (let i = 0; i < routeResults.data.length; i++) {
      newRoutes.unshift({path: routeResults.data[i]['path'], component: DashboardComponent});
      }
    });
  return newRoutes;
}

console.log(routes);
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule],
})

export class AppRoutingModule {
}

Answer 1

在发出API请求以获取路由时，路由将变为异步。在API响应到来时，您只返回了一条带有硬编码的路由。

您可以使用“ Router.config”在您的AppComponent（或任何其他组件）中添加异步路由

在AppComponent构造函数中执行以下操作。

    constructor(router: Router){
        fetch(environment.apiUrl + '/routes/').then((value: Response)  => {
        return value.json();
        }).then((routeResults: ApiResult) => {
        for (let i = 0; i < routeResults.data.length; i++) {
          this.router.config.unshift({path: routeResults.data[i]['path'], component: DashboardComponent});
          }
        });
     }

角路由不接受json数组路由

1 个答案: