Angular: Jak ustawić dynamiczną wartość atrybutowi elementu HTML?

Od już dłuższego czasu, w pracy spędzam czas na implementacji szeroko pojętej dostępności(ang.: accessibility). Ostatnio musiałem dla atrybutu aria-label ustawić wartość, która jest zmienna. Napisałem sobie prostą funkcję, która zwraca wartość dla tego atrybutu.

Tylko nie mogłem tego podpiąć, w taki sposób:

<button aria-label="{{ getAriaLabel() }}">...

Ponieważ przy kompilacji otrzymałem taki błąd: Can't bind to 'aria-label' since it isn't a known property of 'button'

Jeśli wartość atrybutu jest dynamiczna należy posłużyć się zapisem:

<button attr.aria-label="{{ getAriaLabel() }}">...

Przedrostek attr. załatwia sprawę. To się odnosi oczywiście do wszystkich atrybutów.