Ruft ein bestimmtes Objekt anhand seiner ID aus einem Array von Objekten in AngularJS ab

Ich habe eine JSON-Datei mit einigen Daten, auf die ich auf meiner AngularJS-Website zugreifen möchte. Jetzt möchte ich nur ein Objekt aus dem Array holen. So möchte ich zum Beispiel Artikel mit ID 1.

Die Daten sehen folgendermaßen aus:

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

Ich möchte die Daten mit der folgenden AngularJS $ http-Funktionalität laden:

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

was funktioniert. Aber wie kann ich jetzt ein bestimmtes Datenobjekt (nach ID) aus dem Array abrufen, von dem ich es erhalte $http.get?

Vielen Dank im Voraus für Ihre Hilfe.

Grüße Marc

Die einzige Möglichkeit, dies zu tun, besteht darin, über das Array zu iterieren. Wenn Sie sicher sind, dass die Ergebnisse nach ID sortiert sind, können Sie natürlich eine binäre Suche durchführen

Verwenden der ES6-Lösung

Für diejenigen, die diese Antwort noch lesen, wurde die findMethode in Arrays hinzugefügt , wenn Sie ES6 verwenden. Unter der Annahme derselben Sammlung wäre die Lösung:

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

Ich würde mich jetzt voll und ganz für diese Lösung entscheiden, da sie weniger an eckige oder andere Rahmenbedingungen gebunden ist. Reines Javascript.

Winkellösung (alte Lösung)

Ich wollte dieses Problem folgendermaßen lösen:

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

Ein Anwendungsfallbeispiel:

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

Für alle, die sich diesen alten Beitrag ansehen, ist dies derzeit der einfachste Weg, dies zu tun. Es ist nur ein AngularJS erforderlich $filter. Es ist wie Willemoes Antwort, aber kürzer und leichter zu verstehen.

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

WARNUNG

Wie @mpgn sagt, funktioniert dies nicht richtig . Dies wird mehr Ergebnisse erzielen. Beispiel: Wenn Sie 3 suchen, fängt dies auch 23

persönlich benutze ich Unterstrich für diese Art von Sachen ... also

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

dann wäre "a" die Zeile, die Sie von Ihrem Array wollten, in der die ID gleich 2 war

Ich möchte nur etwas zu Willemoes Antwort hinzufügen . Der gleiche Code, der direkt in den HTML-Code geschrieben wurde, sieht folgendermaßen aus:

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

Angenommen, "Ergebnisse" ist eine Variable Ihres FooControllers und Sie möchten die Eigenschaft "Name" des gefilterten Elements anzeigen.

Sie können ng-repeatDaten nur verwenden und auswählen, wenn die Daten mit den gewünschten Daten übereinstimmen. ng-show Beispiel:

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

Sie können einfach Ihr Array durchlaufen:

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

Wenn Sie diese chaotischen Schleifen nicht schreiben möchten, können Sie underscore.js oder Lo-Dash verwenden (Beispiel in letzterem):

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

Wenn Sie die Liste der Elemente wie Stadt auf der Grundlage der Status-ID möchten, verwenden Sie

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

Leider (es sei denn, ich irre mich) denke ich, dass Sie über das Ergebnisobjekt iterieren müssen.

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

Zumindest auf diese Weise bricht es aus der Iteration aus, sobald es die richtige übereinstimmende ID findet.

Warum die Situation komplizieren? Dies ist einfach, schreiben Sie eine Funktion wie diese:

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

Anwendungsfall:

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

Ausgabe:

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>

Ausgabe: Azərbaycan

Wenn Sie können, entwerfen Sie Ihre JSON-Datenstruktur, indem Sie die Array-Indizes als IDs verwenden. Sie können Ihre JSON-Arrays sogar "normalisieren", solange Sie die Array-Indizes problemlos als "Primärschlüssel" und "Fremdschlüssel" verwenden können, beispielsweise als RDBMS. Als solches können Sie in Zukunft sogar so etwas tun:

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

Dies ist die Lösung "By Design" . Für Ihren Fall einfach:

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

Wenn Ihr ID-Format etwa "XX-0001" ist und der Array-Index 0 ist , können Sie natürlich entweder eine Zeichenfolgenmanipulation durchführen, um die ID zuzuordnen. Andernfalls kann nichts dagegen unternommen werden, außer durch den Iterationsansatz.

Ich weiß, dass ich zu spät bin, um zu antworten, aber es ist immer besser, aufzutauchen, als überhaupt nicht aufzutauchen :). ES6 Weg, um es zu bekommen:

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

Der einfache Weg, um (ein) Element aus dem Array anhand der ID abzurufen:

Die find () -Methode gibt den Wert des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird undefined zurückgegeben.

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

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

Sie müssen filter () nicht verwenden und das erste Element xx.filter () [0] abfangen, wie in den obigen Kommentaren

Gleiches gilt für Objekte im 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);

Wenn Sie mehrere IDs haben, verwenden Sie natürlich die filter () -Methode, um alle Objekte abzurufen. Prost

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

    });
});

Ich bin mir nicht sicher, ob es wirklich gut ist, aber das war hilfreich für mich. Ich musste $ scope verwenden, damit es richtig funktioniert.

Verwenden Sie $ timeout und führen Sie eine Funktion aus, um im Array "results" zu suchen

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

    });

Ich würde das Ergebnisarray mit einem Winkelfilter wie diesem durchlaufen:

var foundResultObject = getObjectFromResultsList (Ergebnisse, 1);

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