-
Notifications
You must be signed in to change notification settings - Fork 42
Description
Might be related to #50 and #54
Hello,
I am consuming web components (built using @angular/elements) on my SPA the following way as stated in the docs and examples:
<ax-lazy-element
*axLazyElementDynamic="
'tag'';
url: 'http://127.0.0.1:8080/main.js';
module: false;
"
[language]="language"
[configuration]=configuration
>
The problem I am having is that the first onChanges and the inputs are actually bound after the ngOnInit, so on the ngOnInit none of the inputs are available.
I have done a workaround through this by doing a setTimeout on the ngOnInit and executing all stuff inside it but that is kind of ugly.
If loading the web component the "static way" then the sequence is as expected: input bound -> onChanges -> onInit:
<my-web-comp
[language]="language"
[configuration]="configuration"
(bundle is load through code)
The only thing that has worked so far is passing the inputs as attributes, e.g: configuration='configuration' then the web component follows the expected sequence again: input bound -> onChanges ->onInit, however the value received is a string, not the variable.
Doing configuration={{configuration}} will bind the inputs late as well, and the value will be '[object] [object]' which is even worse.
I have also tried binding the props as attributes: [attr.configuration]=configuration, which will also bind the inputs after the onInit.
One thing that might be related, is that the angular language service complains about that the inputs are not known: Property configuration is not provided by any applicable directives nor by ax-lazy-element element, but I have followed the docs and I cannot find any mistake by my side.
Is there any known workaround, or fix I could do from the shell app?
Thanks