elements.ts

import { BrowserModule } from '@angular/platform-browser';
import { createCustomElement } from '@angular/elements';
import { NgModule, Injector, NgModuleFactory, NgModuleRef } from '@angular/core';
import { SomeService } from './service'
import { AppComponent } from './app.component';

import { DemoElementModule, DemoElement } from './demo-element'

import { DemoElementModuleNgFactory } from './demo-element.ngfactory'

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [SomeService],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(private injector:Injector){

    const elementsModuleInstance:NgModuleRef<DemoElementModule> = DemoElementModuleNgFactory.create(injector);

    console.log(elementsModuleInstance);

    const ElCtor = createCustomElement(DemoElement, {injector: elementsModuleInstance.injector });

    customElements.define('my-el', ElCtor);
  }
  ngDoBootstrap(){

  }
}

manual.ts

import { BrowserModule } from '@angular/platform-browser';
import { createCustomElement } from '@angular/elements';
import { NgModule, Injector, NgModuleFactory, NgModuleRef } from '@angular/core';
import { SomeService } from './service'
import { AppComponent } from './app.component';

import { DemoElementModule, DemoElement } from './demo-element'

import { DemoElementModuleNgFactory } from './demo-element.ngfactory'

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [SomeService],
  //bootstrap: [AppComponent]
})
export class AppModule {
  constructor(private injector:Injector){

    const elementsModuleInstance:NgModuleRef<DemoElementModule> = DemoElementModuleNgFactory.create(injector);

    console.log(elementsModuleInstance);

    const ElCtor = createCustomElement(DemoElement, {injector: elementsModuleInstance.injector });

    customElements.define('my-el', ElCtor);
  }
  ngDoBootstrap(applicationRef:ApplicationRef){
     applicationRef.bootstrap(SomeComponent)
  }
}