Генератор событий в пользовательских веб-элементах в Angular 8 - PullRequest
Новая
       22

Генератор событий в пользовательских веб-элементах в Angular 8

0 голосов
/ 10 февраля 2020

создал пользовательский веб-элемент в angular 8 с использованием angular элементов и веб-компонентов . @input() и new EventEmitter() становятся отключенными, поэтому для ввода значения в компонент, который я использую ElementRef: 

 this.elementRef.nativeElement.getAttribute('name');

, в моем файле app.module я добавил следующий код: 

export class AppModule {
  constructor(private injector: Injector) {}

  ngDoBootstrap() {
    const el = createCustomElement(AppComponent, {
      injector: this.injector
    });

    customElements.define('person', el);
  }
}

После сборки проекта я затем связываю весь файл js в файле dist to 1. Все это хорошо, но я не могу передать событие от компонента к родителю. я импортирую связанный js файл в тег скрипта и вызываю <person name="name"><person> в html. Попытался добавить прослушиватель событий, но событие должно быть доступно по всему проекту, больше похоже на глобальное событие, я попробовал следующее: 

// component (angular 8)
const event = new CustomEvent('notification', {
   detail: {
       message: 'good person',
       type: 'info'
     }
});
const person= document.getElementById('person');
person.dispatchEvent(event);

// pure html project
const person= document.getElementById('person')
person.addEventListener("notification", () => //some code );

, но когда проект выполняет пользовательское событие, детализация всегда null его как компонент и проект не общаются. Как я могу добавить глобальный источник событий, который будет охватывать оба проекта?

...