web-dev-qa-db-fra.com

Quel est le $ hashKey ajouté à mon résultat JSON.stringify

J'ai essayé de regarder sur la page Mozilla JSON stringify de leur documentation, ainsi qu'ici sur SO et Google, mais je n'ai trouvé aucune explication. J'ai utilisé JSOn plusieurs fois mais je n'ai jamais rencontré ce résultat

J'ai un tableau d'objets JSON

[
    {
        "param_2": "Description 1",
        "param_0": "Name 1",
        "param_1": "VERSION 1"
    },
    {
        "param_2": "Description 2",
        "param_0": "Name 2",
        "param_1": "VERSION 2"
    },
    {
        "param_2": "Description 3",
        "param_0": "Name 3",
        "param_1": "VERSION 3"
    }
]

attaché à mon $scope et afin de POST en tant que paramètre, j'ai utilisé la méthode JSON.stringify () et j'obtiens ce qui suit:

   [
        {
            "param_2": "Description 1",
            "param_0": "Name 1",
            "param_1": "VERSION 1",
            "$$hashKey": "005"
        },
        {
            "param_2": "Description 2",
            "param_0": "Name 2",
            "param_1": "VERSION 2",
            "$$hashKey": "006"
        },
        {
            "param_2": "Description 3",
            "param_0": "Name 3",
            "param_1": "VERSION 3",
            "$$hashKey": "007"
        }
    ]

Je suis simplement curieux de savoir ce qu'est exactement le hashkey $$ car je m'attendais à quelque chose de plus semblable à ce qui suit de la méthode stringify:

[
    {
        "1":{
            "param_2": "Description 1",
            "param_0": "Name 1",
            "param_1": "VERSION 1"
        },
         "2":{
            "param_2": "Description 2",
            "param_0": "Name 2",
            "param_1": "VERSION 2"
        },
         "3":{
            "param_2": "Description 3",
            "param_0": "Name 3",
            "param_1": "VERSION 3"
        }
    }
]

Je ne sais pas si c'est un facteur, mais j'utilise Angularjs 1.1.5, JQuery 1.8.2 and Spring 3.0.4 and Spring security 3.0.7 on the Server side

Cela ne me cause aucun problème, mais j'aimerais connaître la cause et la raison du $$hashkey

javascriptjqueryjsonangularjs
276
jonnie

Angular ajoute ceci pour garder une trace de vos modifications, ainsi il sait quand il doit mettre à jour le DOM.

Si vous utilisez angular.toJson(obj) au lieu de JSON.stringify(obj), alors Angular supprimera pour vous ces valeurs à usage interne.

De plus, si vous modifiez votre expression de répétition pour utiliser le suffixe track by {uniqueProperty}, Angular n'aura pas besoin d'ajouter $$hashKey. Par exemple

<ul>
    <li ng-repeat="link in navLinks track by link.href">
        <a ng-href="link.href">{{link.title}}</a>
    </li>
</ul>

Rappelez-vous juste que vous avez besoin du "lien". une partie de l'expression - j'ai toujours tendance à l'oublier. Juste track by href ne fonctionnera sûrement pas.

519
David Boike

Dans mon cas d'utilisation (alimenter l'objet résultant vers X2JS), l'approche recommandée

data = angular.toJson(source);

aider à supprimer les propriétés $$hashKey, mais le résultat ne pourrait alors plus être traité par X2JS .

data = angular.copy(source);

supprime également les propriétés $$hashKey, mais le résultat reste utilisable en tant que paramètre pour X2JS.

69
RobE

Il vient généralement avec la directive ng-repeat. Pour manipuler le dom AngularJS marque les objets avec un identifiant spécial.

Ceci est commun avec Angular. Par exemple, si vous obtenez un objet avec ngResource, votre objet incorporera toutes les API de ressources et vous verrez des méthodes telles que $ save, etc. Avec les cookies aussi, AngularJS ajoutera une propriété __ngDebug.

37
Thomas Pons

Si vous ne souhaitez pas ajouter d'identifiant à vos données, vous pouvez effectuer un suivi en fonction de l'index dans le tableau, ce qui entraînera la saisie des éléments par leur position dans le tableau plutôt que par leur valeur.

Comme ça:

var myArray = [1,1,1,1,1];

<li ng-repeat="item in myArray track by $index">
23
Michael Falck Wedelgård

Si vous utilisez Angular 1.3 ou supérieur, il est recommandé d’utiliser "piste par" dans votre répétition. Angular n'ajoute pas de propriété "$$ hashKey" aux objets de votre tableau si vous utilisez "suivi par". Vous obtenez également des avantages en termes de performances, si quelque chose change dans votre tableau, angular ne recrée pas la structure entière du DOM pour votre ng-repeat, il recrée à la place la partie du DOM pour les valeurs de votre tableau qui ont modifié.

8
Ajay Ullal

Mise à jour: à partir de Angular v1.5, suivi par $index est désormais la syntaxe standard au lieu d'utiliser link car il m'a donné une erreur dupes ng-repeat.

J'ai couru dans ceci pour un imbriqué ng-repeat et le dessous a fonctionné.

<tbody>
    <tr ng-repeat="row in data track by $index">
    <td ng-repeat="field in headers track by $index">{{row[field.caption] }}</td>
</tr>
4
Vinay

Voici comment vous pouvez facilement supprimer la $$ hashKey de l'objet:

$scope.myNewObject = JSON.parse(angular.toJson($scope.myObject))

$scope.myObject - Fait référence à l'objet sur lequel vous souhaitez effectuer l'opération, c.-à-d. Supprimez la valeur $ hashKey de

$scope.myNewObject - Affecte l'objet original modifié au nouvel objet afin qu'il puisse être utilisé si nécessaire

1
Devner

https://www.timcosta.io/angular-js-object-comparisons/

Angular est assez magique la première fois que les gens le voient. Mises à jour automatiques du DOM lorsque vous mettez à jour une variable dans votre JS, et la même variable sera mise à jour dans votre fichier JS lorsque quelqu'un mettra à jour sa valeur dans le DOM. Cette même fonctionnalité fonctionne sur les éléments de page et sur les contrôleurs.

La clé de tout cela est la $$ hashKey Angular qui s'attache aux objets et aux tableaux utilisés dans ng-repeats.

Cette $ hashKey provoque beaucoup de confusion pour les personnes qui envoient des objets complets à une API qui ne supprime pas de données supplémentaires. L'API renverra un 400 pour toutes vos demandes, mais cette $ hashKey ne s'éloignera pas de vos objets.

Angular utilise la $ hashKey pour garder une trace des éléments du DOM appartenant à quel élément d'un tableau en cours de boucle dans une répétition ng. Sans la $ hashKey Angular, _ n'aurait aucun moyen d'appliquer des modifications, car elles se produisent dans le JavaScript ou le DOM sur leur contrepartie, ce qui est l'une des principales utilisations d'Angular.

Considérez ce tableau:

users = [  
    {
         first_name: "Tim"
         last_name: "Costa"
         email: "[email protected]"
    }
]

Si nous rendions cela dans une liste en utilisant ng-repeat = "user in users", chaque objet de celui-ci recevrait une valeur de $ hashKey $$ à des fins de suivi de la part d'Angular. Voici deux façons d'éviter ce $$ hashKey.

1
alfishan aqeel