app.component.ts

import { SidenavService } from './core/service/sidenav.service';
import { Component, ViewChild, OnInit } from '@angular/core';
import { MatSidenav } from '@angular/material';

@Component({
	selector: 'cse-root',
	templateUrl: './app.component.html',
	styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
	@ViewChild('rightAddCourse') public rightAddCourse: MatSidenav;
	constructor(private sidenavService: SidenavService) { }

	ngOnInit() {
		this.sidenavService.setSidenav(this.rightAddCourse);
	}
}

document.addEventListener('WebComponentsReady', function() {
	const customEvent = new CustomEvent('myuw-login', {
		detail: {
			person: {
				// 'firstName': 'Bucky'
			}
		}
	});
	document.dispatchEvent(customEvent);
});