This library provides an Angular Elements Strategy Factory which always runs in the NgZone, allowing automatic change detection
This library is no longer needed for Angular versions 10.1 and above!
see: here
This addresses the following issues with @angular/elements:
- #23841 - elements: change detection breaks in *ngFor loop -- this is fixed in angular 10.1.0
- #24181 - @angular/elements component events are called from an inconsistent zone -- This is fixed in zone.js v0.8.27
install the package:
npm install --save elements-zone-strategy
use the new strategy:
import { ElementZoneStrategyFactory } from 'elements-zone-strategy';
const strategyFactory = new ElementZoneStrategyFactory(HelloComponent, this.injector);
const helloElement = createCustomElement(HelloComponent, { injector: this.injector, strategyFactory });
customElements.define('my-hello', helloElement);
Not needed in Angular 11
use version 10.0.0 for Angular 10 (not needed as of 10.1)
use version 9.0.0 for Angular 9
use version 8.0.0 for Angular 6-8