javascript - Set property dynamically in Vue component for angular

Question

I read this thread and created web-component:

<my-vue-web-comp [userId]="1"></my-vue-web-comp>

It works fine in Angular when I set static prop. But when I try to set property dynamically:

<my-vue-web-comp [userId]="{{ usersInfo.userId }}"></my-vue-web-comp>

my property userId is empty in web-component. It looks like the web component is being converted at compiling and not at runtime.

How can I solve this problem?

Answer 1

I think in Angular you can only do this

<my-vue-web-comp [userId]="usersInfo.userId"></my-vue-web-comp>

or this

<my-vue-web-comp userId="{{ usersInfo.userId }}"></my-vue-web-comp>

if both do not work try this

<my-vue-web-comp user-id="{{ usersInfo.userId }}"></my-vue-web-comp>