No se puede enlazar a 'aria-valuenow' ya que no es una propiedad conocida de 'div'

¿Qué pasa con el siguiente código? Me pasó cuando intenté asignar una expresión a un elemento,

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

también probado como

[aria-valuenow]={{MY_PREC}}

Parece que pasa desde RC5

¿algunas ideas?

angular

— El irreal
fuente

Respuestas:

202

El enlace Angular2 es un enlace de propiedad por defecto. No hay aria-valuenowpropiedad sobre divsi no hay ninguna directiva o componente aplicado que tenga tal@Input()

Utilice en su lugar enlace de atributo explícito

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

[attr.aria-valuenow]="MY_PREC"

— Günter Zöchbauer
fuente

¡Gracias! ¿Qué pasa si necesito hacer algo como esto:style="width:{{current_data/current_max_data | percent:'1.0-1'}}"

— TheUnreal

[ngStyle] = "{width: current_data / current_max_data | percent: '1.0-1'}"

— Günter Zöchbauer

para mí funcionó `[style.width] =" current_data / current_max_data | percent: '1.0-1' "`

— alexopoulos7

Tu publicación me salvó el día. Estoy usando el acordeón bootstrap 4 con <div id="accordion" role="tablist" aria-multiselectable="true">. Necesito poner mi Id en aria-controls en una etiqueta y en div aria-labelledby. Para un [attr.aria-controls]="'collapse'+psl.Id"y para div [attr.aria-labelledby]="'heading'+psl.Id"funcionó para mí.

— aprendizaje ...

Lo siento, esta respuesta no me queda muy clara, ¿necesitamos una @Inputllamada o no?

¿Ha implementado las nuevas cosas ngModule?

Si es así, el orden de las declaraciones tiene un impacto en cómo debería funcionar la aplicación. Tal vez debería intentar declarar sus directivas en otro orden

— Alexis Le Gal
fuente

En archivo .ts:

public MY_PREC = '55';

En archivo .html:

<div class="progress-bar progress-bar-striped active" role="progressbar"
     [attr.aria-valuenow]="MY_PREC" [style.width]="MY_PREC+'%'" aria-valuemin="0" aria-valuemax="100" >
     {{MY_PREC}}
</div>

— ShivarajRH
fuente