CODEWITHSUNDEEP
javascriptangularjs
SSM
SSM

Reputation: 45

HTML view cannot see AngularJS

I am making a backend call using AngularJS using AJAX. My call returns the JSON successfully. This code is written in a JavaScript file.

I have a html file in the same code base which is unable to iterate through this JSON. My JavaScript snippet is as below:

        angular.module('kmapp').controller("FieldCodesCtrl", ['$scope', function($scope){

                var model =  {};

                console.log("FieldCodesCtrl");
                $http.get("/my/rest/URL").success(function (data) {
                    model.items = data;
                    console.log("data set on items");
                    $scope.fieldCodes = model;
                    console.log($scope.fieldCodes.items.length);
                });


               // $scope.fieldCodes = model;

            }]);

My html is as below:

            <tr ng-repeat="item in fieldCodes.items">
                <td>{{item.id}}</td>
                <td>{{item.comment}}</td>
            </tr>

My issue is that the "fieldCodes.items" has nothing in the html. So it does not display the ID and Comment that I get from my JSON.

Can someone please help. I am new to AngularJS. So please excuse me if it is something obvious.

Upvotes: 0

Views: 82

Answers (3)

Owen
Owen

Reputation: 718

Maybe I'm looking at this wrong, but it seems that you are assigning this object to model.items

{ fieldCodes: { 
    items: [
        { id: XXX name: CCC value: DD comment: AA }, 
        { id: aaaa name: aaaaadd value: ddf comment: ee }] 
    }
}

Wouldn't you instead want model = data.fieldCodes; to be able to use fieldCodes.items?

Upvotes: 0

Justin Workman
Justin Workman

Reputation: 388

$http needs to be injected into your controller. 

.controller("FieldCodesCtrl", ['$scope', '$http', function($scope, $http){

Make sure you have your module registered to the HTML tag in the document. I think it is something like "ng-app."

Upvotes: 1

Riyadh Ul Islam
Riyadh Ul Islam

Reputation: 172

Instead of using model.items = data; , Use model = data; Otherwise it will not defined properly. As you are using in your view (model bind) item.id looks ok. so try with this (model = data) Hope this will work. I can Answer you more specify, If you can sent the sample JSON.

Thanks \Riyadh

Upvotes: 1

Related Questions