如何使用Angular的$ http.get从JSON文件中获取特定数据

Question

我有一个包含用户列表的JSON文件。 我只想从列表中获取特定用户，并使用Angular将其显示在索引页面上。 我进行了很多搜索，但找不到很好的答案。 该列表必须在JSON文件中，而不是JS文件中。

sampleApp.controller('userInfo', ['$scope', '$http', '$log', '$filter',  function($scope, $http, $log,$filter) {
$scope.results = '';

$http.defaults.headers.common['X-Custom-Header'] = 'Angular.js';

$http.get('data/registered-user-list.json').
    success(function(data, status, headers, config) {
        $scope.results = data;
    })
    .error(function(data, status, headers, config) {
        // log error
    });
}]);

JSON文件：

{ "results": [
{
  "usernumber": "1",
  "userid": "manojsoni",
  "userpassword": "password",
  "useremail": "manojsoni.online@gmail.com",
  "timestamp": "1:30pm",
  "datestampe": "25/01/2016"
},
{
  "usernumber": "2",
  "userid": "jasmeet",
  "userpassword": "password",
  "useremail": "jasmeet@nagarro.com",
  "timestamp": "1:30pm",
  "datestampe": "25/01/2016"
},
{
  "usernumber": "3",
  "userid": "manoj30dec",
  "userpassword": "password",
  "useremail": "manoj.kumar@nagarro.com",
  "timestamp": "1:30pm",
  "datestampe": "25/01/2016"
},
{
  "usernumber": "4",
  "userid": "lavish",
  "userpassword": "password",
  "useremail": "lavish.sharma@nagarro.com",
  "timestamp": "1:30pm",
  "datestampe": "25/01/2016"
}    
]}

Answer 1

$http.get('data.json'). //json file path
        success(function(data, status, headers, config) {
            alert("Success");
           $scope.resutls = data;
        }).
        error(function(data, status, headers, config) {
            alert("Error");
          // log error
        });

我在这里回答的类似问题

Http获取JSON文件数据并显示

最后，遍历结果并获取所需的数据/用户。

Answer 2

您不会告诉您要过滤哪个creatirea用户。

---

警告！ $http的success和error已弃用，请改用then ！

弃用通知

$ http旧式的Promise方法成功和错误已被弃用。 请改用标准然后方法。 如果$ httpProvider.useLegacyPromiseExtensions设置为false，则这些方法将引发$ http / legacy错误。

// i will update this function when you provide more details
var getData = function(users){
  for(var i in users{
    if(users[i]["theFieldYouWant"] == theValueYouWant){
        return users[i];
    }   
  }
}

$http({
  method: 'GET',
  url: '/someUrl'
}).then(function successCallback(response) {
            // this callback will be called asynchronously
            // when the response is available
            $scope.results = getData(response);
        },
        function errorCallback(response) {
            // called asynchronously if an error occurs
            // or server returns response with an error status.
        }
    );

Answer 3

你可以这样使用

$http.get('data.json').then(function(response) {
    console.log(response);
    $scope.results = response;
},
function(error) {
    $scope.results = [];
    console.log(error);
});

Answer 4

不建议使用成功和错误方法。

您可以使用“ then”代替

$http.get('data/registered-user-list.json').then(function(response) {
    if (response.status == 200) {
        $scope.results = data;
    } else {
        // log error
    }
});