Hey everyone,
in our Angular project, we want to use the vaadin-dialog and render the content using <template>
, instead of using the renderer function, which would bloat the .component.ts file.
The dialog does pop up, but its content is just blank, as shown in the screenshot.
This is what the app.component.html looks like:
<vaadin-dialog no-close-on-esc opened>
<template>
<h2>Hello</h2>
</template>
</vaadin-dialog>
and this is the app.component.ts:
import '@vaadin/vaadin-dialog/vaadin-dialog';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
}
We also have the webcomponents-loader included in our index.html (as in the [using-web-components-in-angular example)]
(https://github.com/vaadin-learning-center/using-web-components-in-angular/tree/master/src).
<script src="webcomponents/webcomponents-loader.js"></script>
We are using version 2.2.1 of vaadin-dialog.
Is there some library/polyfill we are missing or do <template>
s “just not work” in Angular applications?
Any help would be greatly appreciated and many thanks in advance!