Mendapatkan objek tertentu dengan id dari array dari objek di AngularJS
Saya memiliki sebuah file JSON yang mengandung beberapa data yang saya ingin akses pada AngularJS website. Sekarang apa yang saya inginkan adalah untuk mendapatkan hanya satu objek dari array. Jadi saya d seperti misalnya Item dengan id 1.
Data yang terlihat seperti ini:
{ "results": [
{
"id": 1,
"name": "Test"
},
{
"id": 2,
"name": "Beispiel"
},
{
"id": 3,
"name": "Sample"
}
] }Saya ingin memuat data dengan AngularJS $http fungsi seperti ini:
$http.mendapatkan("data/SampleData.json");
yang bekerja. Tapi bagaimana bisa sekarang saya mendapatkan data spesifik obyek (id) dari array yang saya dapatkan dari $http.dapatkan ?
Terima kasih sebelumnya atas bantuan anda.
Menyapa Marc
Menggunakan ES6 solusi
Bagi mereka yang masih membaca jawaban ini, jika anda menggunakan ES6 menemukan metode ditambahkan dalam array. Jadi asumsi koleksi yang sama, solusi'a sama:
const foo = { "results": [
{
"id": 12,
"name": "Test"
},
{
"id": 2,
"name": "Beispiel"
},
{
"id": 3,
"name": "Sample"
}
] };
foo.results.find(item => item.id === 2)I'd benar-benar pergi untuk solusi ini sekarang, karena kurang terkait dengan sudut atau kerangka lainnya. Pure Javascript.
Sudut solusi (solusi tua)
Saya bertujuan untuk memecahkan masalah ini dengan melakukan hal berikut:
$filter('filter')(foo.results, {id: 1})[0];Sebuah use case contoh:
app.controller('FooCtrl', ['$filter', function($filter) {
var foo = { "results": [
{
"id": 12,
"name": "Test"
},
{
"id": 2,
"name": "Beispiel"
},
{
"id": 3,
"name": "Sample"
}
] };
// We filter the array by id, the result is an array
// so we select the element 0
single_object = $filter('filter')(foo.results, function (d) {return d.id === 2;})[0];
// If you want to see the result, just check the log
console.log(single_object);
}]);Plunker: http://plnkr.co/edit/5E7FYqNNqDuqFBlyDqRh?p=preview
Bagi siapa saja yang melihat posting lama ini, ini adalah cara termudah untuk melakukannya saat ini. Ini hanya membutuhkan sebuah AngularJS $filter. Seperti Willemoes menjawab, tapi lebih pendek dan lebih mudah untuk memahami.
{
"results": [
{
"id": 1,
"name": "Test"
},
{
"id": 2,
"name": "Beispiel"
},
{
"id": 3,
"name": "Sample"
}
]
}
var object_by_id = $filter('filter')(foo.results, {id: 2 })[0];
// Returns { id: 2, name: "Beispiel" }PERINGATAN
Sebagai @mpgn mengatakan, ini doesn't bekerja dengan benar. Ini akan menangkap lebih banyak hasil. Contoh: bila anda mencari 3 ini akan menangkap 23 juga
secara pribadi saya menggunakan garis bawah untuk hal-hal seperti ini... jadi
a = _.find(results,function(rw){ return rw.id == 2 });kemudian "a" akan menjadi baris yang anda inginkan array dimana id adalah sama dengan 2
Saya hanya ingin menambahkan sesuatu untuk Willemoes jawaban. Kode yang sama yang ditulis secara langsung dalam HTML akan terlihat seperti ini:
{{(FooController.results | filter : {id: 1})[0].name }}Dengan asumsi bahwa "hasil" adalah variabel yang anda FooController dan anda ingin menampilkan "" properti dari item disaring.
Anda dapat menggunakan ng-repeat dan memilih data hanya jika data sesuai dengan apa yang anda cari menggunakan ng-show
misalnya:
<div ng-repeat="data in res.results" ng-show="data.id==1">
{{data.name}}
</div> 
Anda dapat loop melalui array:
var doc = { /* your json */ };
function getById(arr, id) {
for (var d = 0, len = arr.length; d < len; d += 1) {
if (arr[d].id === id) {
return arr[d];
}
}
}
var doc_id_2 = getById(doc.results, 2);Jika anda don't ingin menulis ini berantakan loop, anda dapat mempertimbangkan untuk menggunakan underscore.js atau Lo-Dash (contoh kedua):
var doc_id_2 = _.filter(doc.results, {id: 2})[0]
Jika anda ingin daftar barang-barang seperti kota pada dasar negara kemudian gunakan id
var state_Id = 5;
var items = ($filter('filter')(citylist, {stateId: state_Id }));
Sayangnya (kecuali saya'm keliru), saya pikir anda perlu untuk iterate atas hasil objek.
for(var i = 0; i < results.length; i += 1){
var result = results[i];
if(result.id === id){
return result;
}
}Setidaknya dengan cara ini ia akan keluar dari perulangan secepat itu menemukan benar sesuai id.
Mengapa mempersulit situasi? ini adalah sederhana menulis beberapa fungsi seperti ini:
function findBySpecField(data, reqField, value, resField) {
var container = data;
for (var i = 0; i < container.length; i++) {
if (container[i][reqField] == value) {
return(container[i][resField]);
}
}
return '';
}Use Case:
var data=[{
"id": 502100,
"name": "Bərdə filialı"
},
{
"id": 502122
"name": "10 saylı filialı"
},
{
"id": 503176
"name": "5 sayli filialı"
}]
console.log('Result is '+findBySpecField(data,'id','502100','name'));output:
Result is Bərdə filialı
Satu-satunya cara untuk melakukan ini adalah untuk iterate atas array. Tentunya jika anda yakin bahwa hasil yang diperintahkan oleh id anda dapat melakukan pencarian biner
$scope.olkes = [{'id':11, 'name':'---Zəhmət olmasa seçim edin---'},
{'id':15, 'name':'Türkyə'},
{'id':45, 'name':'Azərbaycan'},
{'id':60, 'name':'Rusya'},
{'id':64, 'name':'Gürcüstan'},
{'id':65, 'name':'Qazaxıstan'}];
<span>{{(olkes | filter: {id:45})[0].name}}</span>output: Azərbaycan
Aku tahu aku terlambat untuk menjawab tapi itu's selalu lebih baik untuk menunjukkan-up daripada tidak muncul sama sekali :). ES6 cara untuk mendapatkannya:
$http.get("data/SampleData.json").then(response => {
let id = 'xyz';
let item = response.data.results.find(result => result.id === id);
console.log(item); //your desired item
});
Jika anda bisa, desain struktur data JSON dengan memanfaatkan indeks array sebagai Id. Anda bahkan dapat "menormalkan" anda JSON array asalkan anda've tidak ada masalah menggunakan indeks array sebagai "primary key" dan "kunci asing", sesuatu seperti RDBMS. Dengan demikian, di masa depan, anda bahkan dapat melakukan sesuatu seperti ini:
function getParentById(childID) {
var parentObject = parentArray[childArray[childID].parentID];
return parentObject;
}Ini adalah solusi "Dengan Desain". Untuk kasus anda, cukup:
var nameToFind = results[idToQuery - 1].name;Tentu saja, jika anda format ID adalah sesuatu seperti "XX-0001" dari mana indeks array adalah 0, maka anda dapat melakukan beberapa manipulasi string untuk memetakan ID, atau yang lain tidak ada yang dapat dilakukan tentang itu kecuali melalui pendekatan iterasi.
Cara sederhana untuk mendapatkan (satu) elemen dari array dengan id:
Metode find() mengembalikan nilai dari elemen pertama dalam array yang memenuhi disediakan pengujian fungsi. Jika tidak terdefinisi dikembalikan.
function isBigEnough(element) {
return element >= 15;
}
var integers = [12, 5, 8, 130, 160, 44];
integers.find(isBigEnough); // 130 only one element - firstanda don't perlu menggunakan filter() dan menangkap elemen pertama xx.filter()[0] seperti dalam komentar di atas
Hal yang sama untuk benda-benda dalam array
var foo = {
"results" : [{
"id" : 1,
"name" : "Test"
}, {
"id" : 2,
"name" : "Beispiel"
}, {
"id" : 3,
"name" : "Sample"
}
]};
var secondElement = foo.results.find(function(item){
return item.id == 2;
});
var json = JSON.stringify(secondElement);
console.log(json);Tentu saja jika anda memiliki beberapa id kemudian menggunakan filter() metode untuk mendapatkan semua benda. Cheers
function isBigEnough(element) {
return element >= 15;
}
var integers = [12, 5, 8, 130, 160, 44];
integers.find(isBigEnough); // 130 only one element - firstvar foo = {
"results" : [{
"id" : 1,
"name" : "Test"
}, {
"id" : 2,
"name" : "Beispiel"
}, {
"id" : 3,
"name" : "Sample"
}
]};
var secondElement = foo.results.find(function(item){
return item.id == 2;
});
var json = JSON.stringify(secondElement);
console.log(json);
Saya akan iterate atas hasil array menggunakan angularjs filter seperti ini:
var foundResultObject = getObjectFromResultsList(hasil, 1);
function getObjectFromResultsList(results, resultIdToRetrieve) {
return $filter('filter')(results, { id: resultIdToRetrieve }, true)[0];
}
menggunakan $timeout dan menjalankan fungsi untuk pencarian di "hasil" array
app.controller("Search", function ($scope, $timeout) {
var foo = { "results": [
{
"id": 12,
"name": "Test"
},
{
"id": 2,
"name": "Beispiel"
},
{
"id": 3,
"name": "Sample"
}
] };
$timeout(function () {
for (var i = 0; i < foo.results.length; i++) {
if (foo.results[i].id=== 2) {
$scope.name = foo.results[i].name;
}
}
}, 10);
});
projectDetailsController.controller('ProjectDetailsCtrl', function ($scope, $routeParams, $http) {
$http.get('data/projects.json').success(function(data) {
$scope.projects = data;
console.log(data);
for(var i = 0; i < data.length; i++) {
$scope.project = data[i];
if($scope.project.name === $routeParams.projectName) {
console.log('project-details',$scope.project);
return $scope.project;
}
}
});
});Tidak yakin apakah itu's benar-benar baik, tapi ini sangat membantu bagi saya.. Saya perlu menggunakan $ruang lingkup untuk membuatnya bekerja dengan baik.
