我正在尝试为一个简单的master-detail接口使用Angular路由,但是当其中有参数时,我就不能让我的路由工作。
我有这个主组件
export class PersonMasterComponent extends MasterExtentionService implements OnInit {
constructor(
private _snackBar: MatSnackBar,
private _router: Router,
private contService: ContactService)
{ super(contService, _snackBar, null, _router) }
}它继承自:
Injectable()
export class MasterExtentionService {
constructor(private dataService: DataService,
private snackBar: MatSnackBar,
private matDialog?: MatDialog
, private router?: Router
) { }
...
edit(id: number) {
...
this.router.navigate(['crm', 'contacts','detail', id]); // I just type the URL directly for
// this example, this
// will be a variable.
// i've trie navigateByUrl as
// well
}
}
}每当在主组件上单击行时,都会调用edit()。
我以前已经做过一千次了,但我就是找不到这里有什么问题。(我被困在了7号角,刚刚切换到9号)
以下是我的应用程序路由:
const routes: Routes = [
{ path: 'crm', loadChildren: () => import('./crm/crm.module').then(m => m.CrmModule), canActivate: [AuthGuard] },
}以下是我的CRM模块路由:
const routes: Routes = [
{ path: 'contacts/detail/:id', component: PersonDetailComponent }, // I am trying to call this guy
// from PersonMasterComponent
{ path: 'contacts', component: PersonMasterComponent, children: [
// { path: 'detail/:id', component: PersonDetailComponent, }, // tried doing this didn't work
] },
{ path: 'businesses/:id', component: PersonMasterComponent },
{ path: '', component: CrmComponent }
];每当我尝试导航时,路由器都会将该路由识别为已存在的路由,但它很快就会返回到初始路由并重新加载主组件。
这个问题似乎只有在我的路由上有参数时才会发生。我有一种感觉,我遗漏了一些非常基本的东西。
我昨天遇到了这个问题,它快把我逼疯了。任何帮助都将深表感谢。
--编辑以下是路由器在订阅router.events https://docs.google.com/document/d/1rpQRIQJ6UifEsAzIRaWIFbnly4ttljLrOxejuExXVbs/edit时提供的日志
看起来确实找到了正确的路线,但很快就会返回。这似乎只有当我试图从同一个延迟加载模块中的组件加载组件时才会发生,我可以从应用程序的其他部分加载它。
干杯。
发布于 2020-06-03 13:22:07
导航中的verify first项应该以前导/开头,否则它不会考虑根。
this.router.navigate(['/crm', 'contacts','detail', id]); // <- /crmhttps://stackoverflow.com/questions/62162958
复制相似问题