AngularJS'de nesne dizisinden kimliğe göre belirli nesneyi alın

AngularJS web sitemde erişmek istediğim bazı verileri içeren bir JSON dosyam var. Şimdi istediğim, diziden sadece bir nesne almak. Bu yüzden örneğin id 1 olan Öğe istiyorum.

Veriler şuna benzer:

{ "results": [
    {
        "id": 1,
        "name": "Test"
    },
    {
        "id": 2,
        "name": "Beispiel"
    },
    {
        "id": 3,
        "name": "Sample"
    }
] }

Verileri AngularJS $ http işleviyle şu şekilde yüklemek istiyorum:

$http.get("data/SampleData.json");

hangi çalışıyor. Ama şimdi aldığım diziden belirli bir veri nesnesini (id ile) nasıl alabilirim $http.get?

Yardımın için şimdiden teşekkür ederim.

Selamlar Marc

Bunu yapmanın tek yolu, dizi üzerinde yineleme yapmaktır. Açıkçası, sonuçların id'ye göre sıralandığından eminseniz, ikili arama yapabilirsiniz.

ES6 çözümünü kullanma

Hala bu cevabı okuyanlar için find, ES6 kullanıyorsanız, yöntem dizilere eklenmiştir. Aynı koleksiyonu varsayarsak, çözüm şu olur:

const foo = { "results": [
    {
        "id": 12,
        "name": "Test"
    },
    {
        "id": 2,
        "name": "Beispiel"
    },
    {
        "id": 3,
        "name": "Sample"
    }
] };
foo.results.find(item => item.id === 2)

Açısal veya başka herhangi bir çerçeveye daha az bağlı olduğu için, şimdi bu çözümü tamamen tercih ederim. Saf Javascript.

Açısal çözüm (eski çözüm)

Aşağıdakileri yaparak bu sorunu çözmeyi amaçladım:

$filter('filter')(foo.results, {id: 1})[0];

Bir kullanım örneği örneği:

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

Bu eski gönderiye bakan herkes için şu anda bunu yapmanın en kolay yolu budur. Yalnızca bir AngularJS gerektirir $filter. Willemoes'un cevabı gibi, ancak daha kısa ve anlaşılması daha kolay.

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

UYARI

@Mpgn'nin dediği gibi, bu düzgün çalışmıyor . Bu daha fazla sonuç alacaktır. Örnek: 3'ü aradığınızda bu da 23'ü yakalayacaktır

kişisel olarak bu tür şeyler için alt çizgi kullanıyorum ...

a = _.find(results,function(rw){ return rw.id == 2 });

o zaman "a", kimliğin 2'ye eşit olduğu dizinizden istediğiniz satır olur

Willemoes cevabına bir şey eklemek istiyorum . Doğrudan HTML'nin içine yazılan aynı kod şöyle görünecektir:

{{(FooController.results | filter : {id: 1})[0].name }}

"Sonuçlar" ın FooController'ınızın bir değişkeni olduğunu ve filtrelenen öğenin "name" özelliğini görüntülemek istediğinizi varsayarsak.

ng-repeatVerileri yalnızca aradığınızla eşleşirse kullanabilir ve seçebilirsiniz ng-show , örneğin:

 <div ng-repeat="data in res.results" ng-show="data.id==1">
     {{data.name}}
 </div>    

Dizinizin üzerinden geçebilirsiniz:

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);

Bu dağınık döngüleri yazmak istemiyorsanız, alt çizgi.js veya Lo-Dash kullanmayı düşünebilirsiniz (ikincisinde örnek):

var doc_id_2 = _.filter(doc.results, {id: 2})[0]

Eyalet kimliği temelinde şehir gibi öğelerin listesini istiyorsanız şunu kullanın:

var state_Id = 5;
var items = ($filter('filter')(citylist, {stateId: state_Id }));

Ne yazık ki (yanılmıyorsam), sonuçlar nesnesi üzerinde yineleme yapmanız gerektiğini düşünüyorum.

for(var i = 0; i < results.length; i += 1){
    var result = results[i];
    if(result.id === id){
        return result;
    }
}

En azından bu şekilde, doğru eşleşen kimliği bulur bulmaz yinelemeden çıkacaktır.

Durum neden karmaşıklaşıyor? bu basittir, şöyle bir işlev yazın:

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 '';
}

Kullanım Örneği:

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'));

çıktı:

Result is Bərdə filialı

$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>

çıktı: Azərbaycan

Yapabiliyorsanız, dizi dizinlerini ID'ler olarak kullanarak JSON veri yapınızı tasarlayın. Dizi dizinlerini RDBMS gibi "birincil anahtar" ve "yabancı anahtar" olarak kullanmakta sorun yaşamadığınız sürece JSON dizilerinizi bile "normalleştirebilirsiniz". Bu nedenle, gelecekte böyle bir şey bile yapabilirsiniz:

function getParentById(childID) {
var parentObject = parentArray[childArray[childID].parentID];
return parentObject;
}

"Tasarım gereği" çözüm budur . Durumunuz için basitçe:

var nameToFind = results[idToQuery - 1].name;

Elbette, kimlik biçiminiz dizi indeksi 0 olan "XX-0001" gibi bir şeyse , kimliği eşlemek için bir dizi düzenleme yapabilirsiniz; ya da yineleme yaklaşımı dışında bu konuda hiçbir şey yapılamaz.

Cevaplamak için çok geç olduğumu biliyorum ama hiç görünmemek yerine her zaman gelmek daha iyidir :). ES6 elde etmenin yolu:

$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
});

İd'ye göre diziden (bir) öğe almanın basit yolu:

Find () yöntemi, dizide sağlanan test işlevini karşılayan ilk öğenin değerini döndürür. Aksi takdirde tanımsız döndürülür.

function isBigEnough(element) {
    return element >= 15;
}

var integers = [12, 5, 8, 130, 160, 44];
integers.find(isBigEnough); // 130  only one element - first

filter () kullanmanıza ve yukarıdaki yorumlarda olduğu gibi xx.filter () [0] ilk elemanı yakalamanıza gerek yok

Dizideki nesneler için aynı

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);

Elbette birden fazla kimliğiniz varsa, tüm nesneleri almak için filter () yöntemini kullanın. Şerefe

function isBigEnough(element) {
    return element >= 15;
}

var integers = [12, 5, 8, 130, 160, 44];
integers.find(isBigEnough); // 130  only one element - first

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);

    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;
        }
        }

    });
});

Gerçekten iyi olup olmadığından emin değilim, ama bu benim için yardımcı oldu .. Düzgün çalışması için $ kapsam kullanmam gerekiyordu.

$ zaman aşımı kullanın ve "sonuçlar" dizisinde arama yapmak için bir işlev çalıştırın

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);

    });

Aşağıdaki gibi bir açısaljs filtresi kullanarak sonuçlar dizisi üzerinde yineleme yapardım:

var foundResultObject = getObjectFromResultsList (sonuçlar, 1);

function getObjectFromResultsList(results, resultIdToRetrieve) {
        return $filter('filter')(results, { id: resultIdToRetrieve }, true)[0];
    }