https://github.com/kamilkisiela/meteor-angular-lazy
An example of Lazy Loading Angular's NgModules with Meteor 1.5
https://github.com/kamilkisiela/meteor-angular-lazy
angular lazy-loading meteor
Last synced: 4 months ago
JSON representation
An example of Lazy Loading Angular's NgModules with Meteor 1.5
- Host: GitHub
- URL: https://github.com/kamilkisiela/meteor-angular-lazy
- Owner: kamilkisiela
- Created: 2017-06-14T20:41:32.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2017-06-14T20:57:18.000Z (almost 8 years ago)
- Last Synced: 2024-12-27T03:12:36.166Z (6 months ago)
- Topics: angular, lazy-loading, meteor
- Language: TypeScript
- Homepage:
- Size: 8.79 KB
- Stars: 4
- Watchers: 5
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Lazy Loading Angular's NgModules with Meteor 1.5
## module.dynamicImport
Meteor transpiles `import()` into `module.dynamicImport()`.
Since in TS we can't use `import()` syntax, let's use the transpiled form.
```ts
import('./component').then((MyComponent) => {
console.log(MyComponent);
});
``````ts
module.dynamicImport('./component').then((MyComponent) => {
console.log(MyComponent);
});
```## Routing example
Usage of dynamic imports with Angular Router:
```ts
import { NgModule, Type } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router';import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';// function that returns a Promise with a NgModule
export function loadBarModule() {
return module.dynamicImport('./bar/bar.module').then(({BarModule}) => BarModule);
}@NgModule({
imports: [
BrowserModule,
RouterModule.forRoot([
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'home', component: HomeComponent },
// Angular Router's loadChildren method expects a function that returns a Promise
{ path: 'foo', loadChildren: loadFooModule }, // use loadBarModule function
])
],
declarations: [
AppComponent,
HomeComponent
],
bootstrap: [
AppComponent
]
})
export class AppModule {}
```