Add dynamic html property to ChildComponent

Question

I want to add a dynamic html property to my ChildComponent in the html, like hits:

<child-component test={{ variable }}></child.component>

I dont want to use it as an input just need it in the html for testing. I tried the above but when I do this I get an error:

"Can't bind to 'test' since it isn't a known property"

Thanks!

Answer 1

If you childComponent has such property, use property-binding:

<child-component [property]="expression or variable you need to test"></child.component>

If your childComponent doesn't have "test" property, so you may need to use attribute

<child-component [attr.test]="variable"></child.component>

Answer 2

You can make use of attr to just create a attribute!

<child-component [attr.test]="variable"></child.component>