Ottieni un oggetto specifico per id dall'array di oggetti in AngularJS

Ho un file JSON contenente alcuni dati a cui vorrei accedere sul mio sito Web AngularJS. Ora quello che voglio è ottenere un solo oggetto dall'array. Quindi mi piacerebbe ad esempio Item con ID 1.

I dati hanno questo aspetto:

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

Mi piacerebbe caricare i dati con la funzionalità AngularJS $ http in questo modo:

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

che funziona. Ma come posso ora ottenere un oggetto dati specifico (per id) dall'array da cui ottengo $http.get?

Grazie in anticipo per il vostro aiuto.

Saluta Marc

L'unico modo per farlo è iterare sull'array. Ovviamente se sei sicuro che i risultati siano ordinati per id puoi fare una ricerca binaria

Utilizzando la soluzione ES6

Per coloro che stanno ancora leggendo questa risposta, se si utilizza ES6 il findmetodo è stato aggiunto in array. Quindi, supponendo la stessa raccolta, la soluzione sarebbe:

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

Preferirei totalmente questa soluzione ora, poiché è meno legata a angular o qualsiasi altro framework. Javascript puro.

Soluzione angolare (vecchia soluzione)

Ho mirato a risolvere questo problema facendo quanto segue:

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

Un esempio di caso d'uso:

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

Per chiunque guardi questo vecchio post, questo è il modo più semplice per farlo attualmente. Richiede solo un AngularJS $filter. È come la risposta di Willemoes, ma più breve e più facile da capire.

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

AVVERTIMENTO

Come dice @mpgn, questo non funziona correttamente . Questo otterrà più risultati. Esempio: quando cerchi 3, anche questo prenderà 23

personalmente uso il carattere di sottolineatura per questo genere di cose ... quindi

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

quindi "a" sarebbe la riga che volevi del tuo array dove l'id era uguale a 2

Voglio solo aggiungere qualcosa alla risposta di Willemoes . Lo stesso codice scritto direttamente all'interno dell'HTML avrà questo aspetto:

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

Supponendo che "risultati" sia una variabile del tuo FooController e desideri visualizzare la proprietà "nome" dell'elemento filtrato.

Puoi utilizzare ng-repeate selezionare i dati solo se i dati corrispondono a ciò che stai cercando, ng-show ad esempio:

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

Puoi semplicemente eseguire il loop sul tuo 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);

Se non vuoi scrivere questo loop disordinato, puoi prendere in considerazione l'utilizzo di underscore.js o Lo-Dash (esempio in quest'ultimo):

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

Se vuoi l'elenco di elementi come città sulla base dell'ID dello stato, usa

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

Sfortunatamente (a meno che non mi sbagli), penso che sia necessario iterare sull'oggetto risultati.

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

Almeno in questo modo uscirà dall'iterazione non appena troverà l'id corrispondente.

Perché complicare la situazione? questo è semplice scrivere una funzione come questa:

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

Caso d'uso:

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

produzione:

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>

uscita: Azərbaycan

Se puoi, progetta la tua struttura dati JSON utilizzando gli indici dell'array come ID. Puoi anche "normalizzare" i tuoi array JSON finché non hai problemi a utilizzare gli indici dell'array come "chiave primaria" e "chiave esterna", qualcosa come RDBMS. In quanto tale, in futuro, puoi persino fare qualcosa del genere:

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

Questa è la soluzione "By Design" . Per il tuo caso, semplicemente:

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

Ovviamente, se il formato del tuo ID è qualcosa come "XX-0001" di cui il suo indice di matrice è 0 , puoi eseguire qualche manipolazione delle stringhe per mappare l'ID; oppure non si può fare nulla al riguardo se non attraverso l'approccio dell'iterazione.

So di essere in ritardo per rispondere ma è sempre meglio presentarsi piuttosto che non presentarsi affatto :). Modo ES6 per ottenerlo:

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

Il modo più semplice per ottenere (un) elemento dall'array per id:

Il metodo find () restituisce il valore del primo elemento dell'array che soddisfa la funzione di test fornita. In caso contrario, viene restituito undefined.

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

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

non è necessario utilizzare filter () e catturare il primo elemento xx.filter () [0] come nei commenti sopra

Lo stesso per gli oggetti nell'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);

Ovviamente se hai più id, usa il metodo filter () per ottenere tutti gli oggetti. Saluti

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

    });
});

Non sono sicuro che sia davvero buono, ma questo è stato utile per me .. Avevo bisogno di usare $ scope per farlo funzionare correttamente.

usa $ timeout ed esegui una funzione per cercare nell'array "results"

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

    });

Vorrei iterare sull'array dei risultati usando un filtro angularjs come questo:

var foundResultObject = getObjectFromResultsList (risultati, 1);

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