Comments (4)
Fixed in https://github.com/ui-router/ng1-to-ng2/releases/tag/1.0.15
from angular-hybrid.
Ah. I was wondering about that. I haven't been creating lazy-loaded routes since I haven't seen any examples of how to do it with Webpack.
from angular-hybrid.
We're still having this issue.
When we use the visualiser, we can see that states declared on any NgModule are not loaded. But when we navigate to an ng1-declared state which uses an ng2 component, all the NgModule-declared states then appear. Can't work out why...
We're using Webpack, no lazy loading.
from angular-hybrid.
Both UIRouterModule.forChild()
and Ng1ToNg2Module
declare an NgModule with stuff in it. However, it doesn't implicitly instantiate anything from those modules. If you never inject anything that depends on the ng2 UI-Router (for example, a component that uses a UIView
or uiSref
), ng2 DI never instantiates anything from the forChild()
module, so the routes don't get registered.
We need to inject something ng2 for UIRouter
Try this:
- Call
deferIntercept()
on$urlRouterProvider
(tell ui-router not to check url until you're ready) - Add a
.ready()
to your ngUpgrade bootstrap which:- Gets
UIRouter
class for ng2 from the injector - Calls
listen()
andsync()
on the$urlRouter
- Gets
function readyFn(ref: UpgradeAdapterRef) {
// Causes ng2 ui-router bootstrap to happen
ref.ng2Injector.get(UIView); // geta an ng2 class to trigger DI
let $urlRouter = ref.ng1Injector.get('$urlRouter');
$urlRouter.listen();
$urlRouter.sync();
}
upgradeAdapter.bootstrap(document.body, [...]).ready(readyFn);
This is conceptually similar to ng1 inject in a run()
block like so:
app.run([ '$uiRouter', function($uiRouter) {} ])
from angular-hybrid.
Related Issues (20)
- Jest test suite failed to run AngularJS v1.x is not loaded! after upgrade from angular 7 to 9 HOT 6
- How to augment all routes with additional resolve using decorator HOT 2
- ui.router.upgrade' is not available! HOT 1
- Angular 9 - optimization: true breaks build HOT 1
- Version 12 causes "Unknown provider" on Angular states HOT 12
- Upgraded AngularJS component renders itself in ui-view HOT 1
- The target entry-point "@uirouter/angular-hybrid" has missing dependencies HOT 2
- Support for angular12 HOT 5
- UIViewNgUpgrade downgradedModule not specified HOT 1
- ngcc fails
- Angular 14 compatibility HOT 6
- Error bootstrapping AppModule Error: Cannot read properties of undefined (reading 'when') HOT 1
- Failure to inject $transition$ into a downgraded ng2 component HOT 9
- Angular 15 compatibility HOT 3
- After update to 15: UI router error TypeError: this.factory is undefined HOT 19
- random error: Cannot find module '@uirouter/angularjs' or its corresponding type declarations. HOT 3
- Add support for v16 in @uirouter/angular-hybrid HOT 3
- After update to v15.0.2 I get this error "Cannot read properties of undefined (reading 'inherit')"
- Wrong NATIVE_INJECTOR_TOKEN import HOT 2
- Add support for v17 in @uirouter/angular-hybrid HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from angular-hybrid.