Question

我有一个基于angular v6的项目，问题是，每当我尝试在该组件中的任何一个组件上使用mat table时，该组件都会直接重定向到root，而开发人员工具控制台中没有错误。

每当我遇到车辆行驶路线时，它都会将我重定向到根页面，尽管代码中似乎没有什么问题，但是我无法弄清问题所在。

这是我的组件

我的模块

import { MatTableModule } from '@angular/material';
import { RouterModule, Routes } from '@angular/router';
import { BrowserModule } from '@angular/platform-browser';

const routes: Routes = [{path: 'vehicles-temp', component: VehicleHistoryDetailsDialogComponent}];

@NgModule({

  imports: [
    RouterModule.forChild(routes),
    BrowserModule,
    MatTableModule
  ],

  declarations: [
    VehicleHistoryDetailsDialogComponent
  ],

  exports: [
    VehicleHistoryDetailsDialogComponent
  ],

})

export class VehicleHistoryModule {}

我的模板

<table mat-table [dataSource]="[]">

  <ng-container matColumnDef="operation_name">
    <th mat-header-cell *matHeaderCellDef>Operation</th>
    <td mat-cell *matCellDef="let row">{{row.operation_name}}</td>
  </ng-container>

  <ng-container matColumnDef="ro_number">
    <th mat-header-cell *matHeaderCellDef>RO #</th>
    <td mat-cell *matCellDef="let row">{{row.ro_number}}</td>
  </ng-container>

  <ng-container matColumnDef="repair_shop_location">
    <th mat-header-cell *matHeaderCellDef>Location</th>
    <td mat-cell *matCellDef="let row">{{row.repair_shop_location}}</td>
  </ng-container>

  <ng-container matColumnDef="status">
    <th mat-header-cell *matHeaderCellDef>Status</th>
    <td mat-cell *matCellDef="let row">{{row.status}}</td>
  </ng-container>

  <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
  <tr mat-row *matRowDef="let row; columns: displayedColumns;"

应用路由器

`
const appRoutes: Routes = [
  {path: 'login', component: LoginComponent},
  {path: 'login/:profile_id', component: AuthLoginComponent},
  {path: 'signup', component: SignUpComponent},
  {path: 'reset-password', component: ResetPasswordComponent},
  {path: 'reset-password/:token', component: ResetPasswordComponent},
  {path: 'inventory', component: InventoryListComponent, canActivate: [UserService], data: {id: 'inventory_enabled'}},
  {path: 'dashboard', component: DashboardComponent, canActivate: [UserService], data: {id: 'dashboard_enabled'}},
  {path: '', redirectTo: 'ros', pathMatch: 'full'},
  {path: '**', component: NotFoundComponent}
];

@NgModule({
  imports: [
    RouterModule.forRoot(appRoutes)
  ],
  exports: [
    RouterModule
  ]
})
`

更新：如果注释掉表，重定向将停止

Answer 1

我知道了，问题出在我正在使用"target": "es2016"的tsconfig中。将其切换为es5即可重新开始工作。

垫表重定向到根

1 个答案: