Comment puis-je additionner efficacement les propriétés d'un tableau dans AngularJS ?

Somme de tableau avancée dans AngularJS

Dans AngularJS, la sommation des propriétés de tableau peut être une tâche courante. Une approche de base consiste à parcourir le tableau et à accumuler les valeurs des propriétés. Cependant, cette méthode devient fastidieuse lorsqu'elle est confrontée à plusieurs tableaux et à des noms de propriétés variables.

Pour résoudre ce problème, une solution plus flexible et réutilisable est souhaitée, qui permette une sommation pratique de n'importe quelle propriété de tableau. Ceci peut être réalisé à l'aide de la méthode réduire(), qui fournit un moyen puissant d'agréger les valeurs d'un tableau.

Considérons l'exemple suivant :

$scope.traveler = [
    { description: 'Senior', Amount: 50},
    { description: 'Senior', Amount: 50},
    { description: 'Adult', Amount: 75},
    { description: 'Child', Amount: 35},
    { description: 'Infant', Amount: 25 },
];

Pour additionner la propriété 'Amount' du tableau traveler utilisant réduire(), nous pouvons écrire une méthode comme suit :

$scope.sum = function(items, prop){
    return items.reduce( function(a, b){
        return a + b[prop];
    }, 0);
};

Dans cette méthode, nous utilisons la méthode réduire() avec une fonction de rappel qui accepte deux arguments : la valeur accumulée (a) et l'élément actuel (b) du tableau. Dans le rappel, nous accédons à la propriété que nous voulons additionner (prop) et l'ajoutons à la valeur accumulée.

Pour appliquer cette méthode à notre tableau de voyageurs, nous pouvons procéder comme suit :

$scope.travelerTotal = $scope.sum($scope.traveler, 'Amount');

En utilisant cette approche, nous pouvons facilement additionner les valeurs de propriété de n'importe quel tableau de notre application AngularJS. En définissant une méthode réutilisable, nous évitons le code redondant et garantissons la cohérence de nos calculs de sommation.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!