0

我怎么能有一个默认的路由home/Welcome，目前我的路由只是http://localhost:4200/home，我希望用户将默认的 idName 设置为 Welcome。

我的路线设置为：

 const marketRoutes:Routes = [
    {path:'',redirectTo:'home',pathMatch: 'full'},
    {path:'home',component:HomecontainerComponent,children:[
        {path:':idName',component:ContentdetailsComponent} // would like to have 
    default idNameset up as Welcome so that details page would have initial 
    value Welcome
    ]},
    { path: '**', redirectTo: 'home' } 
];

我的 ContentdetailsComponent html 为：

<div class="content-placeholder">
    <div class="content-description">
        <span class="content-heading">Markets Portal</span>
        <span class="content-desc">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</span>
    </div>
    <div class="content-dyna-category">
        <div class="content-category-list">
            <div class="content-categorylist-homeitem" [routerLink]="['Welcome']" routerLinkActive="active"><i class="fa fa-home catrgory-home" aria-hidden="true"></i></div>
            <div class="content-categorylist-subitem"  [routerLink]="['Insights']" >Insights</div>
            <div class="content-categorylist-subitem" [routerLink]="['Enablement']" >Enablement To Win</div>
            <div class="content-categorylist-subitem" [routerLink]="['Account']">Account Best Practices</div>
            <div class="content-categorylist-subitem" [routerLink]="['Best']" >Account Best Practices</div>
            <div class="content-categorylist-subitem" [routerLink]="['Practices']">Account Best Practices</div>
            <div class="content-categorylist-subitem" [routerLink]="['test']" >Account Best Practices</div>
        </div>
        <div class="content-detail-list">
            <router-outlet></router-outlet>

        </div>
    </div>
    <app-whatsnewcontent></app-whatsnewcontent>
</div>
4

2 回答 2

1

你可以试试这个解决方案

我在stackblitz上创建了演示

const marketRoutes:Routes = [
    {path:'',redirectTo:'home',pathMatch: 'full'},
    {path:'home',component:HomeComponent,
      children:[

        { path: '', redirectTo: 'welcome', pathMatch: 'full' },

          { path: 'welcome', component:ContentdetailsComponent }
      ]
    },
    { path: '**', redirectTo: 'home' } 
];
于 2018-06-04T13:52:32.827 回答
1

试试这个代码：

children在数组中添加另一个路由路径为

{path:'', redirectTo:'welcome', pathMatch: 'full'}将其重定向到home/welcome

const marketRoutes:Routes = [
    {path:'',redirectTo:'home',pathMatch: 'full'},
    {path:'home', component:HomecontainerComponent,children:[
        {path:'', redirectTo:'welcome', pathMatch: 'full'}      // Redirects to home/welcome
        {path:':idName',component:ContentdetailsComponent}
    ]},
    { path: '**', redirectTo: 'home' } 
];
于 2018-06-04T14:40:36.157 回答