Passing data through Angular2 router

Question

I have a component where I select a set of image objects. I want to pass these selected images to my new route, CreateAlbum. The data it nested and wouldn\'t be suitable to

Answer 1

Angular >= 7.2.0 introduced a new way of passing the data when navigating between routed components. In NavigationExtras interface within the router module was added a new attribute: state: any and you can set the data which will be present in the new state.

In component

export class ComponentA {
    constructor(private router: Router) {}

    goToComponentB(): void {
        // programmatically        
        this.router.navigate(['/b'], {state: {data: {...}}});
    }
}

In HTML

<a routerLink="/b" [state]="{ data: {...}}">Go to B</a>

Get data in Component B using history.state.data

export class ComponentB {
    constructor() {
       console.log(history.state.data); // GET DATA
    }
}

Thanks to Ľudovít Hajzer Read the whole blog here https://medium.com/ableneo/how-to-pass-data-between-routed-components-in-angular-2306308d8255