Skip to content

Check Platform before call createCustomElement #26

@gogoout

Description

@gogoout

Including this library in a SSR project will break it. See angular/angular#24551

The solution is quite simple, just check platform before call createCustomElement

ngx-element.module.ts https://github.com/brunob15/ngx-element/blob/master/projects/ngx-element/src/lib/ngx-element.module.ts

import { NgModule, Injector, ModuleWithProviders, Inject, PLATFORM_ID } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';
import { NgxElementComponent } from './ngx-element.component';
import { LAZY_CMPS_PATH_TOKEN } from './tokens';

@NgModule({
	declarations: [NgxElementComponent],
	entryComponents: [NgxElementComponent]
})
export class NgxElementModule {

	constructor(private injector: Injector, @Inject(PLATFORM_ID) private platformId: string) {
                // conditional import angular/elements
		if (isPlatformBrowser(platformId)) {
			const { createCustomElement } = require('@angular/elements');
			const ngxElement = createCustomElement(NgxElementComponent, { injector });
			customElements.define('ngx-element', ngxElement);
		}
	}

	static forRoot(modulePaths: any[]): ModuleWithProviders<NgxElementModule> {
		return {
			ngModule: NgxElementModule,
			providers: [
				{
					provide: LAZY_CMPS_PATH_TOKEN,
					useValue: modulePaths
				}
			]
		};
	}

	ngDoBootstrap() {}
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or requesthelp wantedExtra attention is needed

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions