CODEWITHSUNDEEP
angulartypescriptangular2-routing
eric.dummy
eric.dummy

Reputation: 399

Angular 2 Routing - Cannot match any routes in URL Segment

I have lost over 7 days with this, but couldn't get it to work. When I put path to the template in the children, I get the error, and application crashes.

Here is my code:

export const routes: Routes = [
{path: 'store', component: StoreComponent, 
    children: [
          {path: 'apple', component: AppleComponent}
    ]
}

AppleComponent.ts

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

@Component ({
    selector: 'apple',
    templareUrl: '../apple.html
})

export class AppleComponent implements OnInit {
     constructor(){}

     nGOnInit():void{}
}

I have put the <base href="/"> in the index.html file but that didn't help.

I have just started learning Angular2, so please forgive me if I'm asking a stupid question.

EDIT: This would need to go in the children because of router-outlet.

Thanks guys.

Upvotes: 2

Views: 3765

Answers (1)

Aravind
Aravind

Reputation: 41533

You can simply use this 

{ path: 'store/apple', component: AppleComponent, pathMatch: 'full' }

Alternatively you can use this way,

export const storeChildrenRoutes: Routes = [
  {
    path: 'store',
    component: StoreComponent,
    children: [
      {
        path: 'apple',
        component: AppleComponent,
      }
    ]
  }
];
@NgModule({
  imports: [
    RouterModule.forChild(storeChildrenRoutes)
  ],
  exports: [
    RouterModule
  ]
})
export class StoreChildRoutingModule {}

Have this as a separate module and import this to the AppRouting module. where you AppRouting module will contain your main routes which has 

RouterModule.forRoot(appRootRoutes)

Upvotes: 1

Related Questions