How can I access this json data using angular js

Question

Im trying to access this json data using ng-repeat in angular. But I data does not come to the view.

<div class="panel-body" ng-repeat="product in Brands track by $index">

                        <label>{{product.ID}}</label>
                        <label style="margin-right: 10px;">{{product.Name}}</label>
                        <input type="checkbox" ng-model="formData.Selected" ng-true-value='"Y"'
                               ng-false-value='"N"' value="{{product.Name}}" style="margin-right: 10px;" cd-true-value="'{{product.ID}}'" cd-false-value="'None'" />

This is a part of json data

Object {SelectFromDate: Thu Apr 07 2016 00:00:00 GMT+0530 , ToDate: Fri Apr 15 2016 00:00:00 GMT+0530 , Selected: "1"}
    {"data":[{"ID":1,"BrandID":1,"ProductID":1,"Name":"***","Created":"****"},{"ID":2,"BrandID":2,"ProductID":1,"Name":"***","Created":"****"},{"ID":3,"BrandID":3,"ProductID":1,"Name":"***","Created":"****"},{"ID":4,"BrandID":4,"ProductID":1,"Name":"***","Created":"****""},    {"ID":5,"BrandID":5,"ProductID":1,"Name":"***","Created":"****"},

this is the controller

$scope.submit = function() {
        console.log($scope.formData);


            angularService.PostAngularFormData($scope.formData).then(function (response) {
                $scope.Brands = JSON.stringify(response);
                console.log($scope.Brands);

            });

Can you provide " console.log(response) " console log out put ? — Amila Sampath
– Amila Sampath, Commented Apr 19, 2016 at 10:31
the part I have shown as json data is the console.log responce — Tharindu
– Tharindu, Commented Apr 19, 2016 at 10:34
Can you provide " console.log(response) " console log all out put ? I try my self — Amila Sampath
– Amila Sampath, Commented Apr 19, 2016 at 11:13
when I try to log responce this error occurs Unexpected token o at Object.parse (native) — Tharindu
– Tharindu, Commented Apr 19, 2016 at 11:17
@Amila Thank you so much for your support. When I used angular.fromJson instel of JSON.stringify it worked. Thanks again for the help — Tharindu
– Tharindu, Commented Apr 19, 2016 at 11:34

Devidas Kadam · Accepted Answer · 2016-04-19 11:10:13Z

2

Use this

$scope.allResponse = JSON.parse(response);
$scope.brands = $scope.allResponse.data;
console.log($scope.brands);

or use

$scope.brands = angular.fromJson(response.data);
console.log($scope.brands);

edited Apr 19, 2016 at 11:10

answered Apr 19, 2016 at 10:25

Devidas Kadam

9549 silver badges19 bronze badges

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

8 Comments

Tharindu Over a year ago

Thank you for the reply. But when I use this I get the following error 'angular.js:13294 SyntaxError: Unexpected token o at Object.parse (native)

Amila Sampath Over a year ago

Can you provide " console.log(response) " console log out put ?

Tharindu Over a year ago

the part I have shown as json data is the console.log responce

Devidas Kadam Over a year ago

you have misspelled the 'Brands' is 'Brandss'

Devidas Kadam Over a year ago

if you wants to products then use $scope.allResponse = JSON.parse(response); $scope.products = $scope.allResponse.data; you will get an array of products in $scope.products. use it in ng-repeat

|

Amila Sampath · Accepted Answer · 2016-04-19 11:03:21Z

1

Modify controller

angularService.PostAngularFormData($scope.formData).then(function (response) {
        $scope.Brands = response.data; 
        console.log($scope.Brands);

    });

Try it and give console out put

edited Apr 19, 2016 at 11:03

answered Apr 19, 2016 at 10:38

Amila Sampath

6454 gold badges11 silver badges28 bronze badges

11 Comments

Tharindu Over a year ago

[Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object] 0 : Object 1 : Object 2 : Object 3 : Object 4 : Object 5 : Object 6 : Object 7 : Object 8 : Object 9 : Object 10 : Object 11 : Object 12 : Object 13 : Object 14 : Object 15 : Object 16 : Object 17 : Object 18 : Object 19 : Object 20 : Object'

Tharindu Over a year ago

I have been using ng-repeat to get data

Amila Sampath Over a year ago

ng-repeat="brand in Brands track by $index" <-- use and get result

Tharindu Over a year ago

When I use that I only get a large blank space in the view. No text or data visible

Amila Sampath Over a year ago

If ng-repeat="brand in Brands" and inside ng-repeat div use {{brand}}, What is view out come?

|

Amila Sampath · Accepted Answer · 2016-04-19 11:33:20Z

0

Modify controller

// I assume you result array 
var array = {"data":[{"ID":1,"BrandID":1,"ProductID":1,"Name":"RI","Created":"2016-04-11T23:‌19:03.463"},
                 {"ID":2,"BrandID":2,"ProductID":1,"Name":"BLE","Created":"2016-04-11T‌23:19:03.48"} ]};

$scope.brands = array.data;

Inside view

<div ng-repeat="brand in brands">
    {{brand}}
</div>

my View out put

{"ID":1,"BrandID":1,"ProductID":1,"Name":"RI","Created":"2016-04-11T23:‌19:03.463"}
{"ID":2,"BrandID":2,"ProductID":1,"Name":"BLE","Created":"2016-04-11T‌23:19:03.48"}

Try it and solve your problem

answered Apr 19, 2016 at 11:33

Amila Sampath

6454 gold badges11 silver badges28 bronze badges

1 Comment

Tharindu Over a year ago

Thanks @Amila. I will try this too. angular.fromJson solved this too. Thanks again

Collectives™ on Stack Overflow

How can I access this json data using angular js

Im trying to access this json data using ng-repeat in angular. But I data does not come to the view.

3 Answers 3

8 Comments

11 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Im trying to access this json data using ng-repeat in angular. But I data does not come to the view.

3 Answers 3

8 Comments

11 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related