[AngularJS] Angular 7 Library Route Module does not work when imported in application

[Raul Valentini]

I need a help about an issue that I cannot solve.
I'm studying angular 7 library in order to add modularization to my 
application but module routes defined in library seems not work when 
install it in a application. 

I have created project to github to reproduce problem: <br/>
Library test [foo-lib](https://github.com/rvt80/foo-tester) <br/>
External Application[foo-tester](https://github.com/rvt80/foo-tester) <br/>

In each ReadMe file I have described how to reproduce this issue.

I have created an example library (foo-lib) with its routing module with 
child route defined, then I had builded and tested it in a simple 
application in the same workspace. 
All worked fine, and library routing is correctly added to test application.
On the next step I exported builded library and included it in another 
application example in another workspace by npm link command, and runed ng 
serve command on this app.
With this configuration I received an error if try to achieve library route 
paths, as if they was not added to main route module.

Foo-lib-routing.module.ts

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


import { MainComponent } from './components/main/main.component';
import { NewFooCmpComponent } from 
'./components/new-foo-cmp/new-foo-cmp.component';


const UP_ROUTES: Routes = [
  { path: 'main_path',  component: MainComponent,
    children: [
      { path: 'child', component: NewFooCmpComponent }
    ]
  }
];


@NgModule({
  imports: [RouterModule.forChild(UP_ROUTES)],
  exports: [RouterModule]
})


export class FooLibRoutingModule { }


```
Foo-lib.module.ts

```

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


import { FooLibRoutingModule } from './foo-lib-routing.module';


import { MainComponent } from './components/main/main.component';
import { FooLibComponent } from './foo-lib.component';
import { NewFooCmpComponent } from 
'./components/new-foo-cmp/new-foo-cmp.component';


@NgModule({
  declarations: [
    MainComponent,
    FooLibComponent,
    NewFooCmpComponent],
  imports: [
    FooLibRoutingModule
  ],
  exports: [
    FooLibComponent,
    NewFooCmpComponent]
})
export class FooLibModule { }


```
app.module.ts

```
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';




import { RoutingModule } from './routing.module';


import { AppComponent } from './app.component';
import { WelcomeComponent } from './components/welcome/welcome.component';
import { NotFoundComponent } from 
'./components/not-found/not-found.component';


import { FooLibModule } from '@foo/lib';


@NgModule({
  declarations: [
    AppComponent,
    WelcomeComponent,
    NotFoundComponent
  ],
  imports: [
    BrowserModule,
    RoutingModule,
    FooLibModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }


```

routing.module.ts

```

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { WelcomeComponent } from './components/welcome/welcome.component';
import { NotFoundComponent } from 
'./components/not-found/not-found.component';


const APP_ROUTES: Routes = [
  { path: 'welcome', component: WelcomeComponent },
  { path: 'notfound', component: NotFoundComponent },
  { path: '', redirectTo: '/welcome', pathMatch: 'full' },
];


/**
 * Main client routing configuration module
 */
@NgModule({
  imports: [ RouterModule.forRoot(APP_ROUTES) ],
  exports: [ RouterModule ]
})


export class RoutingModule {}



```

Error show in console when try to navigate to library route

```
core.js:15714 ERROR Error: Uncaught (in promise): Error: Cannot match any 
routes. URL Segment: 'main_path/child'
Error: Cannot match any routes. URL Segment: 'main_path/child'
    at ApplyRedirects.push../node_modules/@angular/router/fesm5/router.js.
ApplyRedirects.noMatchError (router.js:2469)

```

-- 
You received this message because you are subscribed to the Google Groups 
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to angular+unsubscr...@googlegroups.com.
To post to this group, send email to angular@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.