Use routing from Angular Components in Hybrid mode

Question

I'm using AngularJS 1.5 and Angular 7 in hybrid mode. How can I change the url in an Angular component? I tried like to access the current url as follows:

constructor(private router: Router, private route: ActivatedRoute) {
    console.log(this.route.snapshot.queryParams);

}

The query parameters are always empty. In a parent AngularJS component I get the query parameters using the $location service. If I try to change the route using the router, it says invalid route. How can I change the current url in an Angular component? Currently I'm emitting an event, which in turn is grabbed by the parent AngularJS component who can use the $location service.

Answer 1

I managed to do it by upgrading the AngularJS $location service:

@Injectable()
export class LocationService {

    search(queryParameter?: string, value?: string): string | any {
        return undefined;
    }
}

In AppModule do the following

{provide: LocationService, useFactory: (i: any) => i.get('$location'), deps: ['$injector']},