Apa $ hashKey ditambahkan ke hasil JSON saya .stringify

288

Saya telah mencoba melihat pada halaman Mozilla JSON yang menjernihkan dokumen mereka serta di sini di SO dan Google tetapi tidak menemukan penjelasan. Saya telah menggunakan JSOn sebagai pengikat banyak waktu tetapi tidak pernah menemukan hasil ini

Saya memiliki berbagai objek 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"
    }
]

terlampir pada saya $scopedan agar POSTmereka sebagai salah satu parameter saya menggunakan metode JSON.stringify () dan saya mendapatkan yang berikut:

   [
        {
            "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"
        }
    ]

Saya hanya ingin tahu apa sebenarnya hashkey $$ karena saya mengharapkan sesuatu yang lebih mirip dengan yang berikut dari metode 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"
        }
    }
]

Saya tidak yakin apakah itu faktor tetapi saya menggunakan Angularjs 1.1.5, JQuery 1.8.2 and Spring 3.0.4 and Spring security 3.0.7 on the Server side

Itu tidak menyebabkan saya masalah tetapi saya ingin tahu penyebab dan alasan untuk $$hashkey

jonnie
sumber
8
ditambahkan oleh angularjs
Arun P Johny
69
alih-alih JSON.stringify use angular.toJson ()
Arun P Johny
Terima kasih kawan, jika ada yang ingin menambahkan penjelasan Anda sebagai jawaban, saya akan dengan senang hati menerima
jonnie
1
Jawaban ini adalah penjelasan yang bagus .. stackoverflow.com/questions/12336897/…
Charlie Martin

Jawaban:

530

Angular menambahkan ini untuk melacak perubahan Anda, jadi ia tahu kapan harus memperbarui DOM.

Jika Anda menggunakan angular.toJson(obj)alih-alih JSON.stringify(obj)maka Angular akan menghapus nilai penggunaan internal ini untuk Anda.

Juga, jika Anda mengubah ekspresi ulangi untuk menggunakan track by {uniqueProperty}akhiran, Angular tidak perlu menambahkan $$hashKeysama sekali. Sebagai contoh

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

Ingatlah selalu bahwa Anda memerlukan "tautan." bagian dari ekspresi - Saya selalu cenderung lupa itu. Hanya track by hrefpasti tidak akan bekerja.

David Boike
sumber
Apakah ada tes kinerja tentang «track by» vs «$$ hashKey»? (UPD. Ok, saya sudah mencarinya di Google dan «track by» lebih
disukai
Pelacakan @artuska oleh id sangat mudah karena tidak ada hash yang harus dihitung, Anda hanya menggunakan kembali id ​​yang ada atau menambah penghitung ...
Christophe Roussy
3
dan jika Anda memiliki filter untuk diterapkan, berikut ini urutan yang benar:, item in somelist | filter:somefilter track by item.keyjangan menulis filter di akhir baris!
Lewen
1
Catatan! Saya menggunakan array dengan metode klon yang disalin kemudian memasukkan elemen ke dalam array, yang kemudian di-render oleh ng-repeat. Saya mendapatkan kesalahan 'duplikat kunci' sudut saat menggunakan JSON.parse (JSON.stringify (obj)) untuk mengkloning elemen saya. Menggunakan JSON.parse (angular.toJson (obj)); hal yang diperbaiki. Terima kasih!
SAL
1
Anda juga dapat menggunakan fitur Penjilidan Satu Waktu menggunakan tanda titik dua :: untuk mencegah pembaruan jika Anda hanya menampilkan data. <a ng-href="link.href"> {{:: link.title}} </a>
phil
70

Dalam kasus penggunaan saya (memberi makan objek yang dihasilkan ke X2JS) pendekatan yang direkomendasikan

data = angular.toJson(source);

membantu menghapus $$hashKeyproperti, tetapi hasilnya kemudian tidak bisa lagi diproses oleh X2JS .

data = angular.copy(source);

menghapus $$hashKeyproperti juga, tetapi hasilnya tetap dapat digunakan sebagai parameter untuk X2JS.

rob2universe
sumber
37

Itu datang dengan arahan ng-repeat biasanya. Untuk melakukan manipulasi dom, AngularJS menandai objek dengan id khusus.

Ini biasa terjadi pada Angular. Misalnya jika Anda mendapatkan objek dengan ngResource, objek Anda akan menyematkan semua API sumber daya dan Anda akan melihat metode seperti $ save, dll. Dengan cookie terlalu AngularJS akan menambahkan properti __ngDebug.

Thomas Pons
sumber
bagaimana saya harus menghapus properti ini? Apakah sudut menyediakan cara untuk melakukan itu?
Nilesh
1
Model sudut akan pecah jika Anda mencoba untuk menghapus properti itu, saya sarankan untuk menyalin variabel. Lihat jawaban @ David-Boike tentang cara memfilter hashkey
Josue Alexander Ibarra
23

Jika Anda tidak ingin menambahkan id ke data Anda, Anda dapat melacak dengan indeks dalam array, yang akan menyebabkan item dikunci oleh posisi mereka dalam array bukan nilainya.

Seperti ini:

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

<li ng-repeat="item in myArray track by $index">
Michael Falck Wedelgård
sumber
Itu membutuhkan asumsi bahwa pesanan barang Anda tidak akan pernah berubah. :)
neatcoding
8

Jika Anda menggunakan Angular 1.3 atau lebih tinggi, saya sarankan Anda menggunakan "track by" di ng-repeat Anda. Angular tidak menambahkan properti "$$ hashKey" ke objek dalam array Anda jika Anda menggunakan "track by". Anda juga mendapatkan manfaat kinerja, jika sesuatu dalam array Anda berubah, angular tidak membuat ulang seluruh struktur DOM untuk ulangi ng Anda, itu malah menciptakan kembali bagian DOM untuk nilai-nilai dalam array Anda yang telah berubah.

Ajay Ullal
sumber
4

Pembaruan: Dari Angular v1.5, lacak $indexsekarang adalah sintaks standar alih-alih menggunakan tautan karena memberi saya ng-repeatkesalahan dupes.

Saya berlari ke ini untuk bersarang ng-repeatdan di bawah ini berhasil.

<tbody>
    <tr ng-repeat="row in data track by $index">
    <td ng-repeat="field in headers track by $index">{{row[field.caption] }}</td>
</tr>
Vinay
sumber
Hanya untuk memperjelas - atribut yang digunakan dalam jalur dengan ekspresi harus unik di seluruh koleksi berulang. $ index adalah salah satu opsi. Dalam kebanyakan kasus itu sudah cukup, tetapi kadang-kadang Anda mungkin menemukan berguna untuk melacak berdasarkan atribut unik. (Id, ...)
Martin Hlavňa
Itu membutuhkan asumsi bahwa pesanan barang Anda tidak akan pernah berubah. :)
neatcoding
3

Berikut adalah cara Anda dapat dengan mudah menghapus hashKey $$ dari objek:

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

$scope.myObject - Mengacu pada Objek yang ingin Anda lakukan operasi yaitu menghapus $ hashKey dari

$scope.myNewObject - Tetapkan objek asli yang dimodifikasi ke objek baru sehingga dapat digunakan seperlunya

Devner
sumber
Saya menemukan ini tidak perlu rumit. Anda bisa menghapus bidang tunggal itu - atau setiap bidang dimulai dengan $. Tetapi mungkin Anda tidak perlu - melihat jawaban lain.
sevcsik
1

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

Angular cukup ajaib saat pertama kali orang melihatnya. Pembaruan DOM otomatis ketika Anda memperbarui variabel di JS Anda, dan variabel yang sama akan memperbarui dalam file JS Anda ketika seseorang memperbarui nilainya di DOM. Fungsi yang sama ini berfungsi di seluruh elemen halaman, dan di seluruh pengontrol.

Kunci dari semua ini adalah $$ hashKey Angular menempel pada objek dan array yang digunakan dalam ng-ulangan.

$ HashKey ini menyebabkan banyak kebingungan bagi orang-orang yang mengirim objek penuh ke API yang tidak menghapus data tambahan. API akan mengembalikan 400 untuk semua permintaan Anda, tetapi $$ hashKey tidak akan pergi dari objek Anda.

Angular menggunakan hashKey $$ untuk melacak elemen mana di DOM yang termasuk item mana dalam array yang sedang di-loop dalam ng-repeat. Tanpa $$ hashKey Angular tidak akan memiliki cara untuk menerapkan perubahan yang terjadi dalam JavaScript atau DOM ke mitra mereka, yang merupakan salah satu kegunaan utama untuk Angular.

Pertimbangkan array ini:

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

Jika kami merendernya ke dalam daftar menggunakan ng-repeat = "user in users", setiap objek di dalamnya akan menerima hashKey $$ untuk tujuan pelacakan dari Angular. Berikut adalah dua cara untuk menghindari hashKey $$ ini.

alquran aqeel
sumber