时间戳

首页 > 解决方案 > Angular Web 组件和路由

angular - Angular Web 组件和路由

问题描述

我正在做一些有角度的网络组件，就像这个例子在这里说的。

所有 Web 组件在父应用程序中都可以正常显示（例如：http://localhost:8080/dashboard），但我当前的问题是我的 Web 组件中有一个按钮，我需要转到 Web 组件配置文件（例如：http ://localhost:8080/dashboard/profile）。

我尝试了几个例子，但没有一个有效。

有人可以指导我吗？先感谢您。

标签： angularangular-routingangular-elements

解决方案

您的一些代码将有助于查看您当前拥有的内容以及它可能出现的问题。

在您的 dashboard.component.html 文件中，您可能希望有一个链接到您的路由器的按钮或链接元素 ()：

<a routerLink="/dashboard/profile">Login</a>

您的 app-routing.module.ts 应该具有以下内容：

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

// importing your component to route to 
import { DashboardProfileComponent } from './dashboardprofile/dashboardprofile.component';

// your route
const routes: Routes = [
  {path: 'dashboard/profile', component: DashboardProfileComponent},
];

// standard
@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

不要忘记在你的 app.module.ts 中导入你的路由模块。 app.module.ts

import { AppRoutingModule } from './app-routing.module';

推荐阅读