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

时间:2016-01-27 06:26:02

标签: javascript angularjs json

我有一个包含用户列表的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"
}    
]}

4 个答案:

答案 0 :(得分:0)

$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 get json file data and display

最后循环遍历结果并获取您需要的数据/用户。

答案 1 :(得分:0)

您不知道要过滤哪个creatirea用户。

警告!折旧success的{​​{1}}和error,请改用$http

  

弃用通知

     

$ http遗留承诺方法成功与错误   弃用。请改用标准方法。如果   $ httpProvider.useLegacyPromiseExtensions设置为false然后这些   方法将抛出$ http / legacy错误。

then

答案 2 :(得分:0)

你可以像这样使用

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

答案 3 :(得分:0)

不推荐使用成功和错误方法。

您可以使用'then'代替

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