0

I have a JSON file which has a user list. I want to get only a specific user from the list, and display it on an index page using Angular. I've searched a lot, but can't get a good answer. The list has to be in a JSON file, not in a JS file.

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

The JSON file:

{ "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"
}    
]}
  • Please go through this. http://stackoverflow.com/questions/19706046/how-to-read-an-external-local-json-file-in-javascript. read the file. iterate through the results and get the specific user. – SuperNova Jan 27 '16 at 06:31
  • Check this, I have answered here [$http get to get Json data](http://stackoverflow.com/a/34995214/2742156) – Pratap A.K Jan 27 '16 at 06:35
  • On which criteria you want specific user? – RIYAJ KHAN Jan 27 '16 at 06:42

4 Answers4

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

Similar question I have answered here

Http get json file data and display

At last loop through the result and get the data/user which you need.

Community
  • 1
  • 1
Pratap A.K
  • 4,337
  • 11
  • 42
  • 79
0

You don't tell on which creatirea you want to filter the user.

warning! The success and error for $http are depreciated, use then instead!

Deprecation Notice

The $http legacy promise methods success and error have been deprecated. Use the standard then method instead. If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.

// 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.
        }
    );
AlainIb
  • 4,544
  • 4
  • 38
  • 64
0

you can use like this

$http.get('data.json').then(function(response) {
    console.log(response);
    $scope.results = response;
},
function(error) {
    $scope.results = [];
    console.log(error);
});
Shaishab Roy
  • 16,335
  • 7
  • 50
  • 68
0

success and error methods are deprecated.

You can use 'then' instead

$http.get('data/registered-user-list.json').then(function(response) {
    if (response.status == 200) {
        $scope.results = data;
    } else {
        // log error
    }
});
Manos Pasgiannis
  • 1,693
  • 1
  • 18
  • 30
  • your answer is some wrong. you can pass two callbacks functions to the then. the first for success, the second for error. see my answer posted 1 hours before – AlainIb Jan 27 '16 at 07:57
  • Actually it is not wrong. The method is called when a response is available. If the response has an error status, it is still called. – Manos Pasgiannis Jan 27 '16 at 08:03
  • see the official doc. – AlainIb Jan 27 '16 at 08:04
  • The documentation says exactly what I told you. The method is called in any case. You can try it... – Manos Pasgiannis Jan 27 '16 at 08:37
  • so try this : http://plnkr.co/edit/F02jKK1kl8RvPTX6CgmI?p=preview "firstcallback " is never displayed because the $http failed .... "The documentation says exactly what I told you.". can you past this please i don't find it. this is pretty clear ! `$http.get('/someUrl', config).then(successCallback, errorCallback);` two callbacks function, first for success second for error – AlainIb Jan 27 '16 at 08:46
  • your answer is ok to filter 200 for other success code ( 200 to 299 ) but if you have a 400 or 404 error you need the errorCallback ;) – AlainIb Jan 27 '16 at 08:52
  • In your plunker my method is not called at all. Maybe because of old angular version. I will update your plunker to the latest version of angular, so you can see that it works. I didn't say that your method doesn't work. Give me a few minutes. The documentation say that "this callback will be called asynchronously when the response is available". Http 400 and 404 are both valid responses and call the method. – Manos Pasgiannis Jan 27 '16 at 09:08
  • it is from https://docs.angularjs.org/api/ng/service/$http , this is the latest version ( 1.5.... ) i will see the answer. thanks – AlainIb Jan 27 '16 at 09:10
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/101753/discussion-between-manos-pasgiannis-and-alainib). – Manos Pasgiannis Jan 27 '16 at 09:17