Impossibile eseguire il binding a "aria-valuenow" poiché non è una proprietà nota di "div"

Cosa c'è di sbagliato nel codice seguente? Mi è successo quando ho provato ad assegnare un'espressione 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>

provato anche come

[aria-valuenow]={{MY_PREC}}

Sembra che accada da RC5

qualche idea?

angular

— TheUnreal
fonte

Risposte:

206

L'associazione Angular2 è l'associazione di proprietà per impostazione predefinita. Non vi è alcuna aria-valuenowproprietà su divse non è stata applicata alcuna direttiva o componente con tale estensione@Input()

Usa invece l'associazione di attributi esplicita

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

[attr.aria-valuenow]="MY_PREC"

— Günter Zöchbauer
fonte

Grazie! E se avessi bisogno di fare qualcosa del genere: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

per me ha funzionato "[style.width] =" current_data / current_max_data | percent: '1.0-1' "`

— alexopoulos7

Il tuo post mi ha salvato la giornata. Sto usando la fisarmonica bootstrap 4 con <div id="accordion" role="tablist" aria-multiselectable="true">. Devo inserire il mio ID in aria-controls su un tag e in div aria-labelledby. Per a [attr.aria-controls]="'collapse'+psl.Id"e per div ha [attr.aria-labelledby]="'heading'+psl.Id"funzionato per me.

— apprendimento ...

Scusa questa risposta non mi è molto chiara, abbiamo bisogno di una @Inputchiamata o no?

Hai implementato la nuova roba ngModule?

In tal caso, l'ordine delle dichiarazioni ha un impatto su come dovrebbe funzionare l'applicazione. Forse dovresti provare a dichiarare le tue direttive in un altro ordine

— Alexis Le Gal
fonte

Nel file .ts:

public MY_PREC = '55';

Nel file .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
fonte