Show Json Data in view File

Question

I am using Firebase with Ionic Framework.I am Fetching the Record using this code:

var ref = new Firebase("https://blazing-fire-2739.firebaseio.com/new");
  var arr=[];
      // Retrieve new posts as they are added to our database
        ref.on("child_added", function(snapshot, prevChildKey) {
        var newPost = snapshot.val();
       //console.log(newPost);
         arr.push(newPost.data);

        //console.log("Author: " + newPost.data.email);
        //console.log("Title: " + newPost.date_of_birth);
       // console.log("Previous Post ID: " + prevChildKey);
      });
     $scope.datas = arr;
     console.log($scope.datas)

It will print something like:

[]
0 =>Object { email="kk@gmail.com",  firstname="karan",  lastname="sofat",  more...}
1=>Object { email="jj@gmail.cpm",  firstname="jyotsna",  lastname="kaushal",  more...}

I am Showing in View File:

<div class="item item-button-right" ng-repeat = "x in datas" >
   {{x.email}}

  </div>

This will does not print anything

possible duplicate of [How come Angular doesn't update with scope here?](http://stackoverflow.com/questions/21922470/how-come-angular-doesnt-update-with-scope-here) — Kato, Aug 24 '15 at 19:45
The classic scope.$apply() / $timeout() question. See link above for some background on Angular's compiler and async ops. — Kato, Aug 24 '15 at 19:45
Also, check out AngularFire. We wrote a library and an [entire guide](https://www.firebase.com/docs/web/libraries/angular/), to help you handle these complexities. — Kato, Aug 24 '15 at 19:47

score 0 · Answer 1 · answered Aug 21 '15 at 10:50

Your array data is not in proper JSON array format.Do like this,

 function MyCtrl($scope) {
   $scope.datas = [{
            email: "kk@gmail.com",
            firstname: "karan",
            lastname: "sofat"
        }, {
            email: "jj@gmail.cpm",
            firstname: "jyotsna",
            lastname: "kaushal"
    }];
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script>
<div   ng-app ng-controller="MyCtrl">
    <div class="item item-button-right" ng-repeat="x in datas">
            {{x.email}}
        </div>
</div>

This won't make the asynchronously loaded data appear in the view. — Kato, Aug 24 '15 at 19:48

score -1 · Answer 2 · edited May 23 '17 at 10:28

-1

As the jQuery API says: "Load JSON-encoded data from the server using a GET HTTP request."

So you cannot load a local file with that function. But as you browse the web then you will see that loading a file from filesystem is really difficult in javascript as the following thread says: Local file access with javascript

edited May 23 '17 at 10:28

Community

1
1

answered Aug 21 '15 at 09:45

Arun

87
13

Not a question about jQuery, not a GET request, and not loading a local file (is loading data from a Firebase database). – Kato Aug 24 '15 at 19:47

Show Json Data in view File

2 Answers2