I have Angular 8 app defined as web component and I have Lightning Web Component (LWC) app.

Inside LWC I am trying to pass data into web component through the property of DOM element like

this.template.querySelector('my-custom-element').myCustomProp = {isWork: false}

and it fails. But on visual force page it works fine.

In debug console myCustomProp is available on element in case of using of it in visual force page but not in case with LWC. Seems the reason of fail is Locker Service

Also passing of data as string through setAttribute works fine:

my-custom-element.setAttribute('my-custom-prop', '{isWork: true}');

Who was facing with that problem? Any solution?

  • Maybe try lwc:dom="manual" on the element? Commented Dec 4, 2019 at 20:23
  • already use, does not impact on it Commented Dec 5, 2019 at 7:11

1 Answer 1


Also have faced this problem. This solution:

my-custom-element.setAttribute('my-custom-prop', '{isWork: true}');

works for me. But have to add that my-custom-prop should be named starting with data: data-my-custom-prop otherwise it will not work. The final working version will be:

my-custom-element.setAttribute('data-my-custom-prop', '{isWork: true}');

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .