Ascribe a variable to JSON Angular

Question

How to ascribe a variable to JSON name?

JSON names object

[
    { "name": "John", "age" : "12" },
    { "name": "Ben", "age" : "15" },
    { "name": "Jason", "age" : "18" },
    { "name": "Billy", "age" : "11" }
]

Angular service and controller

var app = angular.module('app', []);
    app.service('service', function($http, $q){
        var deferred = $q.defer();

        $http.get("jsonfile.json").then(function(data){
            deferred.resolve(data);
        });

        this.getNames = function(){
            return deferred.promise;
        }
    });
    app.controller('secondCtrl', function($scope, service){
        var promise = service.getNames();
        promise.then(function(data){
            $scope.names = data.data;
            console.log($scope.names);

        });
});

What I tried to do in controller:

var name = names.name;

And then I tried in HTML ng-repeat {{name}} but it didn't work.

just like you did in secondCtrl : promise.then(...) was the good way. But anywhere outside the callback passed to then() would be useless because service didn't finish retrieving the data — Mouradif
– Mouradif, Commented Jan 3, 2017 at 14:12

Mistalis · Accepted Answer · 2017-01-03 14:03:40Z

3

You can just loop over your names object in HTML with ng-repeat.

If your array is:

$scope.names = [
    { "name": "John", "age" : "12" },
    { "name": "Ben", "age" : "15" },
    { "name": "Jason", "age" : "18" },
    { "name": "Billy", "age" : "11" }
];

You can show names.name with this code:

<div ng-repeat="n in names">{{n.name}}</div>

edited Jan 3, 2017 at 14:03

answered Dec 23, 2016 at 11:10

Mistalis

18.3k14 gold badges78 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

bafix2203 Over a year ago

Yes i know i can show names.name with ng-repeat="n in names"

Mouradif Over a year ago

Well you said in your original post "And then I tried in HTML ng-repeat {{name}} but it didn't work.". What was that supposed to mean ?

Collectives™ on Stack Overflow

Ascribe a variable to JSON Angular

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related