如何解决如何基于下拉值进行路由?
我正在尝试基于下拉值进行路由,并且我想将新的html附加到现有的html中。例如 我有一个组件main.ts和main.html,另一个组件是submain.ts和submain.html。 在我的main.ts中,我有一个列表-
routes = [
{
value: 'process1',display: 'Process1'
},{
value: 'process2',display: 'process2'
}
]
onActivate(event) {
console.log("insde activate ")
if (event instanceof Test2Component) {
this.currentRoute = 'react';
}
}
ngOnInit() {
this.currentRoute = '';
}
routeTo(e) {
console.log('something change')
this.router.navigate(['/' + e]);
}
在我的main.html中:
<select [(ngModel)]="currentRoute" (change)="routeTo(currentRoute)">
<option *ngFor="let r of routes" [ngValue]="r.value">{{r.display}}</option>
</select>
<router-outlet (activate)="onActivate($event)"></router-outlet>
当前网址为主要网址,但我要将网址更改为:
main/process1 // if process1 selected...
main/process2 // if process2 selected...
然后使用我的路由器插座将其与submain.html内容放到那里(main.html)。 但是,每当我选择任何值时,它都会显示“错误:无法匹配任何路由。URL段:'process1'”。我相信问题出在路由上。我在app.routing-modules.ts中添加了以下内容:
{path:'main',component:MainComponent,pathMatch:'full'}
感谢您的帮助!
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。