1

I have to integrate third-party elements into my Angular(4.3.x) application. They look something like:

<any-widget id="123"></any-widget>

I already made Angular produce no error by adding schemas: [ CUSTOM_ELEMENTS_SCHEMA ] to app.module.ts. But unfortionally i can't but anything to it. I tried:

<any-widget [id]="id"></any-widget>

and

<any-widget id="{{id}}"></any-widget>

But id is not displayed at all. Any idea how to make this work?

Mick
  • 8,203
  • 10
  • 44
  • 66

1 Answers1

2
<any-widget [attr.id]="id"></any-widget>

or

<any-widget attr.id="{{id}}"></any-widget>

Without attr. Angular tries to bind to a property of an HTML element, or an @Input() of an Angular directive. If none of these exists with the used name, you need to use attribute binding.

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567