Calcolo percentuale angolare in html

Question

Noob angolare qui! Sto cercando di visualizzare un valore percentuale nel mio html come segue:

<td> {{ ((myvalue/totalvalue)*100) }}%</td> 

Funziona ma a volte dà un lunghissimo decimale che sembra strano. Come faccio a arrotondarlo a 2 cifre dopo il decimale? C'è un approccio migliore a questo?

Answer 1

È possibile utilizzare il metodo toFixed di Number.

((myValue/totalValue)*100).toFixed(2) 

Answer 2

Usa ng-bind, che non avrebbe mostrato parentesi graffe fino a quando l'espressione risolto.

Html

<td ng-bind="roundedPercentage(myValue, totalValue) + '%'"></td> 

controller

$scope.roundedPercentage = function(myValue, totalValue){ 
    var result = ((myValue/totalValue)*100) 
    return Math.round(result, 2); 
} 

Answer 3

Si potrebbe usare un filtro, come questo qui sotto per jeffjohnson9046

Il filtro fa l'ipotesi che l'ingresso sarà in forma decimale (cioè il 17% è 0,17).

myApp.filter('percentage', ['$filter', function ($filter) { 
    return function (input, decimals) { 
    return $filter('number')(input * 100, decimals) + '%'; 
    }; 
}]); 

Usage:

<tr ng-repeat="i in items"> 
    <td>{{i.statistic | percentage:2}}</td> 
</tr> 

Answer 4

Io uso spesso the built-in 'number' filter a tale scopo;

<span>{{myPercentage | number}}</span> 

da 2 decimali:

<span>{{myPercentage | number:2}}</span> 

Per 0 decimale;

<span>{{myPercentage | number:0}}</span> 

Answer 5

all'interno del vostro controller.js (angular.js 1.x) o app.component.ts (angular2) calcolare una percentuale (logica) di un valore totale con un altro valore come questo.

this.percentage = Math.floor(this.myValue/this.value * 100); 

Quindi mostrare la percentuale nel codice html.

<p>{{percentage}}%</p> 

Esempio matematico semplice: 3/10 * 100 = 30%. Se myValue è 3 e value è 10 il risultato sarà 30. Utilizzare la funzione integrata Math.floor() di Javascript per arrotondare il numero e rimuovere il decimale.