angular - Can't bind to 'aria-valuenow' since it isn't a known property of 'div'

Question

What's wrong with the following code? Hapenned to me when I tried to assign an expression to an element,

<div class="progress-bar progress-bar-striped active" role="progressbar"
  aria-valuenow="{{MY_PREC}}" aria-valuemin="0" aria-valuemax="100" >
    {{MY_PREC}}
  </div>

also tried as

[aria-valuenow]={{MY_PREC}}

Seem like it happens since RC5

any ideas?

Answer 1

Angular2 binding is property binding by default. There is no aria-valuenow property on div if there is no directive or component applied that has such an @Input()

Use instead explicit attribute binding

attr.aria-valuenow="{{MY_PREC}}" 

or

[attr.aria-valuenow]="MY_PREC"