Question

我使用用户名和密码admin＆amp;进行正常登录admin.In登录组件导航到layout.But我收到错误，如＆＃34; core.js：1448 ERROR错误：未捕获（在承诺中）：错误：无法匹配任何路由。网址细分：＆＃39;布局＆＃39;＆＃34;。请帮我..

app.routing.module.ts

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


@NgModule({
    imports: [
        RouterModule.forRoot([
            {path: '', redirectTo: '/login', pathMatch: 'full'},
            {path: 'login', loadChildren: 'app/login/login.module#LoginModule'}

        ])
    ],
    exports: [
        RouterModule
    ]
})
export class AppRoutingModule {
}

我的login.component.ts是

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';

import { AuthenticationService } from '../../services/authentication.service';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {

  username:string;
  password:string;

  constructor(

    public authService: AuthenticationService,
    private route: ActivatedRoute,
    private router: Router) { }

  ngOnInit() {

  }

  login(){
    if(this.authService.login(this.username, this.password)){
      this.router.navigate(['/layout']);
    }
  }
}

我的login.routing.module.ts是

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginComponent } from './login/login.component';
import { LayoutComponent } from '../layout/layout/layout.component';
import { LayoutRoutingModule } from '../layout/layout-routing.module';

const routes: Routes = [
  { path: '', component: LoginComponent },
  { path: 'layout', component: LayoutComponent }




];
@NgModule({
imports: [RouterModule.forChild(routes)],

  exports: [RouterModule]
})
export class LoginRoutingModule { }

Answer 1

扩展JB Nizet在你的评论中所说的，当你有一个延迟加载的模块时，该延迟加载模块内部的路径是相对的。如果在延迟加载之前有任何路径，则该路径预先设置为延迟加载模块中的所有路径。

所以在这种情况下，这是您的路径映射的方式：

路径：＆＃39;＆＃39;
加载组件：LoginComponent
原因：重定向到＆＃39; / login＆＃39;。有关详细信息，请参阅下面的登录信息。

路径：＆＃39; / login＆＃39;
加载组件：LoginComponent
为什么：延迟加载LoginModule，其中匹配路径为＆＃39;＆＃39;因此加载LoginComponent

路径：＆＃39; / login / layout＆＃39;
加载的组件：LayoutComponent
为什么：延迟加载LoginModule，其中匹配＆＃39; layout＆＃39;的路径因此加载LayoutComponent

路径：＆＃39; / layout＆＃39;
加载组件：无原因：因为这不是＆＃39; login＆＃39;它不会延迟加载LoginModule，因此只是查看app.routing，其中唯一有效的路径是＆＃39;＆＃39;＆＃39;和＆＃39; / login＆＃39;

Answer 2

当我尝试实现延迟加载后，问题就出现了。

创建SpecificModule.routing.module.ts文件

const路线：路线= [ {path：“”，component：AComponent，canActivate：[AuthGuard]}， {路径：“ newmessage”，组件：BComponent，canActivate：[AuthGuard]，}， {路径：“ editmessage /：MessageId /：Mode”，组件：NewmessageComponent，canActivate：[AuthGuard]}， ];

@NgModule（{ 导入：[RouterModule.forChild（routes）]，出口：[RouterModule] }）
将SpecificModuleRoutingModule导入到SpecificModule
将SpecificModuleRouting的条目添加到AppRoutingModule。

从“ @ angular / core”导入{NgModule}; 从“ @ angular / router”导入{Routes，RouterModule}; 从“ ./shared/services/auth.guard”导入{AuthGuard};

const路线：路线= [ {path：“ specificmodule”，loadChildren：（）=> import（“ ./ specificmodule / specificmodule.module”）。然后（d => d.SpecificModule），canActivate：[AuthGuard]}， ];

@NgModule（{ 导入：[RouterModule.forRoot（routes）]，出口：[RouterModule] }）导出类AppRoutingModule {}
将SpecificModule导入到AppModule [缺少导致问题的原因]

未捕获（承诺）：错误：无法匹配任何路线。网址细分：＆＃39;布局＆＃39;在Angular

2 个答案: