Получить конкретный объект по идентификатору из массива объектов в AngularJS

У меня есть файл JSON, содержащий некоторые данные, к которым я хотел бы получить доступ на моем веб-сайте AngularJS. Теперь я хочу получить только один объект из массива. Так что я бы хотел, например, Item с id 1.

Данные выглядят так:

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

Я хотел бы загрузить данные с помощью функции AngularJS $ http следующим образом:

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

который работает. Но как мне теперь получить конкретный объект данных (по идентификатору) из массива, из которого я получаю $http.get?

Заранее спасибо за вашу помощь.

Приветствует Марка

Единственный способ сделать это - перебрать массив. Очевидно, если вы уверены, что результаты упорядочены по идентификатору, вы можете выполнить двоичный поиск

Использование решения ES6

Для тех, кто все еще читает этот ответ, если вы используете ES6, findметод был добавлен в массивы. Итак, предполагая ту же коллекцию, решение будет:

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

Я бы полностью выбрал это решение сейчас, поскольку оно менее привязано к angular или любой другой структуре. Чистый Javascript.

Угловое решение (старое решение)

Я стремился решить эту проблему, выполнив следующие действия:

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

Пример использования:

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

Для всех, кто просматривает этот старый пост, это самый простой способ сделать это на данный момент. Для этого требуется только AngularJS $filter. Это похоже на ответ Виллемоса, но короче и легче для понимания.

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

ПРЕДУПРЕЖДЕНИЕ

Как говорит @mpgn, это не работает должным образом . Это даст больше результатов. Пример: при поиске 3 будет найдено и 23

лично я использую подчеркивание для такого рода вещей ... так что

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

тогда "a" будет той строкой, которую вы хотели в своем массиве, где идентификатор был равен 2

Я просто хочу добавить кое-что к ответу Виллемоса . Тот же код, написанный непосредственно внутри HTML, будет выглядеть так:

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

Предполагая, что «результаты» - это переменная вашего FooController, и вы хотите отобразить свойство «имя» фильтруемого элемента.

Вы можете использовать ng-repeatи выбирать данные только в том случае, если данные соответствуют тому, что вы ищете, ng-show например:

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

Вы можете просто перебрать свой массив:

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

Если вы не хотите писать эти беспорядочные циклы, вы можете рассмотреть возможность использования underscore.js или Lo-Dash (пример последнего):

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

Если вам нужен список элементов, таких как город, на основе идентификатора состояния, используйте

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

К сожалению (если я не ошибаюсь), я думаю, вам нужно перебрать объект результатов.

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

По крайней мере, таким образом он выйдет из итерации, как только найдет правильный соответствующий идентификатор.

Зачем усложнять ситуацию? это просто напишите какую-нибудь функцию вроде этой:

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

Пример использования:

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

вывод:

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>

вывод: Azərbaycan

По возможности спроектируйте структуру данных JSON, используя индексы массива в качестве идентификаторов. Вы даже можете «нормализовать» свои массивы JSON, если у вас нет проблем с использованием индексов массива в качестве «первичного ключа» и «внешнего ключа», что-то вроде РСУБД. Таким образом, в будущем вы даже можете сделать что-то вроде этого:

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

Это решение «By Design» . В вашем случае просто:

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

Конечно, если ваш формат идентификатора похож на «XX-0001», индекс массива которого равен 0 , тогда вы можете либо выполнить некоторые операции со строкой, чтобы сопоставить идентификатор; иначе с этим ничего нельзя поделать, кроме итерационного подхода.

Я знаю, что слишком поздно отвечать, но всегда лучше появиться, чем не появляться вообще :). ES6 способ получить это:

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

Простой способ получить (один) элемент из массива по id:

Метод find () возвращает значение первого элемента в массиве, который удовлетворяет предоставленной функции тестирования. В противном случае возвращается undefined.

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

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

вам не нужно использовать filter () и ловить первый элемент xx.filter () [0], как в комментариях выше

То же самое для объектов в массиве

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

Конечно, если у вас несколько идентификаторов, используйте метод filter (), чтобы получить все объекты. ура

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

    });
});

Не уверен, что это действительно хорошо, но это было полезно для меня ... Мне нужно было использовать $ scope, чтобы он работал правильно.

используйте $ timeout и запустите функцию для поиска в массиве "результатов"

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

    });

Я бы перебирал массив результатов, используя фильтр angularjs следующим образом:

var foundResultObject = getObjectFromResultsList (результаты, 1);

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