piral-ng 0.15.0-beta.4813 → 0.15.0-beta.4815

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +33 -2
  2. package/package.json +3 -3
package/README.md CHANGED
@@ -30,7 +30,7 @@ The extension slot module to be used in Angular components. This is not really n
30
30
 
31
31
  You can use the `fromNg` function from the Pilet API to convert your Angular components to components usable by your Piral instance.
32
32
 
33
- Example use:
33
+ ### Example Usage
34
34
 
35
35
  ```ts
36
36
  import { PiletApi } from '<name-of-piral-instance>';
@@ -75,7 +75,38 @@ export function setup(piral: PiletApi) {
75
75
  }
76
76
  ```
77
77
 
78
- Angular Options:
78
+ ### Lazy Loading
79
+
80
+ Even better, you can also lazy load the respective Angular module and components using the callback-based overload of `defineNgModule`:
81
+
82
+ ```ts
83
+ import { PiletApi } from '<name-of-piral-instance>';
84
+
85
+ export function setup(piral: PiletApi) {
86
+ // this "teaches" Piral about the given module, which is lazy loaded
87
+ // important; in this case `./AppModule.ts` has a `default` export
88
+ const loadComponent = piral.defineNgModule(() => import('./AppModule'));
89
+
90
+ // to fully lazy load we cannot reference the class anymore;
91
+ // instead we reference the selector of the component
92
+ piral.registerPage('/sample', loadComponent('angular-page'));
93
+ }
94
+ ```
95
+
96
+ In the example above, the `AngularPage` would have been defined to look like
97
+
98
+ ```js
99
+ // ...
100
+ @Component({
101
+ // ...
102
+ selector: 'angular-page',
103
+ })
104
+ export class AngularPage { /* ... */ }
105
+ ```
106
+
107
+ which defines the selector (`angular-page`) matching the specified selector in the `setup` function.
108
+
109
+ ### Angular Options
79
110
 
80
111
  You can optionally provide Options to `defineNgModule`, which are identical to those given to `bootstrapModule` during the Angular boot process. See https://angular.io/api/core/PlatformRef#bootstrapModule for possible values.
81
112
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "piral-ng",
3
- "version": "0.15.0-beta.4813",
3
+ "version": "0.15.0-beta.4815",
4
4
  "description": "Plugin for integrating Angular components in Piral.",
5
5
  "keywords": [
6
6
  "piral",
@@ -79,7 +79,7 @@
79
79
  "@angular/platform-browser": "^14.0.0",
80
80
  "@angular/platform-browser-dynamic": "^14.0.0",
81
81
  "@angular/router": "^14.0.0",
82
- "piral-core": "0.15.0-beta.4813",
82
+ "piral-core": "0.15.0-beta.4815",
83
83
  "rxjs": "^7.3.0"
84
84
  },
85
85
  "peerDependencies": {
@@ -90,5 +90,5 @@
90
90
  "@angular/router": "^2.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0 || ^9.0.0 || ^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0 || ^14.0.0",
91
91
  "rxjs": "^5.0.0 || ^6.0.0 || ^7.0.0"
92
92
  },
93
- "gitHead": "2790199e9c9e3792899f3325f0584d97af77e795"
93
+ "gitHead": "4942bf8aff67eca5fce289da420399421f0d27de"
94
94
  }