如何转到指定的 URL？答案

【问题标题】：How can I go to specified URL?如何转到指定的 URL？
【发布时间】：2019-12-31 13:46:17
【问题描述】：

我正在我的 Angular 项目上创建路由机制，但出现 URL 路由错误。应用程序找不到 URL。

这是我的路由机制。

navigation.ts

{
        id: 'documentation-management',
        title: 'Dokümantasyon Yönetimi',
        type: 'collapse',
        icon: 'feather icon-folder',
        children: [
          {
            id: 'documentation-list',
            title: 'Doküman Listesi',
            type: 'item',
            url: '/tr/documentation-management/documentation/documentation-list'
          },
          {
            id: 'definitions',
            title: 'Tanımlar',
            type: 'collapse',
            children: [
              {
                id: 'documentation-category',
                title: 'Doküman Kategorileri',
                type: 'item',
                url: '/tr/documentation-management/definitions/documentation-category/documentation-category-list'
              }
            ]
          }
        ]
      }

app-routing.module.ts

{
   path: ':lang/documentation-management',
   loadChildren: './documentation-management/documentation-management.module#DocumentationManagementModule'
}

documentation-management-routing.module.ts

const routes: Routes = [
  {
    path: '',
    children: [
      {
        path: 'documentation',
        loadChildren: './documentation/documentation.module#DocumentationModule'
      },
      {
        path: 'definitions',
        loadChildren: './definitions/definitions.module#DefinitionsModule'
      }
    ]
  }
];

definitions-routing.module.ts

const routes: Routes = [
  {
    path: '',
    children: [
      {
        path: 'documentation-category',
        loadChildren: './documentation-category/documentation-category.module#DocumentationCategoryModule'
      }
    ]
  }
];

documentation-category-routing.module.ts

const routes: Routes = [
  {
    path: '',
    children: [
      {
        path: 'documentation-category-list',
        loadChildren: './documentation-category-list/documentation-category-list.module#DocumentationCategoryListModule'
      },
      {
        path: 'documentation-category-edit',
        loadChildren: './documentation-category-edit/documentation-category-edit.module#DocumentationCategoryEditModule'
      },
      {
        path: 'documentation-category-edit/:id',
        loadChildren: './documentation-category-edit/documentation-category-edit.module#DocumentationCategoryEditModule'
      }
    ]
  }
];

documentation-category-list-routing.module.ts

const routes: Routes = [
  {
    path: '',
    component: DocumentationCategoryListComponent
  }
];

我对不同的模块有相同的路由机制，它正在工作。我不知道这不起作用。

我应该能够转到 navigation.ts 文件中的指定 URL，但出现以下错误：

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'tr/documentation-management/definitions/documentation-category/documentation-category-list'
Error: Cannot match any routes. URL Segment: 'tr/documentation-management/definitions/documentation-category/documentation-category-list'

这是我的应用程序结构：

- app
  - documentation-management
      - definitions
          - documentation-category
             - documentation-category-list

  - human-resources
      - definitions
          - education-group
             - education-group-list

你能帮我解决这个问题吗？

【问题讨论】：

尝试一次添加一个“路由级别”。有很多路线。
是的，看起来很复杂。这是什么 => "documentation-category-edit/:id" 。我看不到 :id 的角色
问题是关于文档类别列表，而不是文档类别编辑。 @尼古拉·卢基奇
我有相同的路由和不同的路由，它正在工作。 @Jens Alenius
想知道关卡。您将有如下路线：'server-url/definitions/documentation-category/documentation-category-list' 是否有必要？如果您喜欢 server-url/definitions/{}/documentation-category/{}/documentation-category-list，我会理解的。但也许你有？

标签： angular typescript module routing

【解决方案1】：

在app.routing.module.ts

const routes: Routes = [
  { path: 'documentation-management', loadChildren: () => import('./path to the module/documentation-management.module').then(mod => mod.documentationManagement)
}
];

在您的文档管理的路由模块中导入与此相同的其他模块。

【讨论】：

我们为什么要这样使用？我是因为好奇才问的。
在 Angular 8 中，它是导入模块的新方法。它在调用路径时导入该模块。从而减少浏览器上的内存，使应用程序更快。（延迟加载功能）
不要尝试使用tr/documentation-management/definitions/documentation-category/documentation-category-list。只需使用documentation-category-list（如果您在同一模块中使用）
尝试 1 级。如果失败，可能会有不同的问题。
您要从哪个模块的组件中访问 routerLink？

【解决方案2】：

我解决了这个问题。 Angular 在其路由机制中不允许使用相同的模块名称。这些模块位于不同的文件夹结构中并不重要。

当我改变时；

{
   path: 'definitions',
   loadChildren: './definitions/definitions.module#DefinitionsModule'
}

到

{
   path: 'definitions',
   loadChildren: './definitions/definitions.module#DocumentationManagementDefinitionsModule'
}

成功了。

【讨论】：