I have a large angularjs 1.7.4 app with UI-router in HTML5 mode with multiple entrypoints.
(The project uses babel 7.6 to compile typescript and corejs3 polyfills, so I am not using angular-cli).
I am trying to migrate one of the entry points to a hybrid application (Angular 8.2.13, @uirouter/angular-hybrid 9.0.0).
I have followed the migration guide @ https://angular.io and the guide at https://github.com/ui-router/angular-hybrid and everything seem to be working except state definitions in Angular. They only work AFTER an angularjs state with an Angular component has been triggered.
There is nothing in the console (with trace enabled for ui-router) when trying to use the NG2 states before that.
I've been stuck on this for days now and I am out of ideas...
ng1hello - ng1 state with angular component ng2hello - angular state with angular component ng1hi - ng1 state with angular component ng2hi - ng2 state with angular component
Case 1:
Case 2:
Case 3:
Case 4:
edit: I reproduced the problem in Stackblitz here: https://angular-hybrid-issue.stackblitz.io/ https://stackblitz.com/edit/angular-hybrid-issue
I was apparently using the wrong method to get hold of the UrlService in main.ts (Angular context)
Was:
import {getUIRouter} from "@uirouter/angular-hybrid";
const urlService: UrlService = getUIRouter(platformRef.injector).urlService;
Should've been:
const urlService: UrlService = platformRef.injector.get(UrlService);
https://github.com/ui-router/angular-hybrid/issues/368
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With