在Angular表中显示JSON数据

Question

I just started looking at an old project, and I am stuck with a problem. I want to show some data in a table, but i forgot how it works with json objects and angular.

I am getting data from an API that looks like this.

{"Search":[{"Title":"Not Another Teen Movie","Year":"2001","imdbID":"tt0277371","Type":"movie","Poster":"http://ia.media-imdb.com/images/M/MV5BODYyNTQyNzAzNF5BMl5BanBnXkFtZTgwNTA4ODYxMTE@._V1_SX300.jpg"},{"Title":"Not Just Another 8 Teen Movie","Year":"2003","imdbID":"tt0381457","Type":"movie","Poster":"N/A"},{"Title":"Not Just Another 8 Teen Movie 2","Year":"2003","imdbID":"tt0397579","Type":"movie","Poster":"N/A"},{"Title":"Not Just Another 8 Teen Movie 3","Year":"2004","imdbID":"tt0408045","Type":"movie","Poster":"N/A"}],"totalResults":"4","Response":"True"}

Then i am scoping the data like this

$scope.AllMoviesFound = data;

And then i want to show all the different titles in my table

<table class="table table-striped table-hover">
            <thead>
            <tr class="success">
                <th>
                        <h3>Title</h3></a>
                </th>
            </tr>
            </thead>
            <tbody>
            <tr ng-repeat="item in AllMoviesFound">
                <td><h4>{{item.Title}}</h4></td>
            </tr>
            </tbody>
        </table>

But i can not quite get this to work. What am i missing in my table?

Answer 1

$scope.AllMoviesFound = data.Search

Answer 2

You can use

var response = '{"Search":[{"Title":"Not Another Teen Movie","Year":"2001","imdbID":"tt0277371","Type":"movie","Poster":"http://ia.media-imdb.com/images/M/MV5BODYyNTQyNzAzNF5BMl5BanBnXkFtZTgwNTA4ODYxMTE@._V1_SX300.jpg"},{"Title":"Not Just Another 8 Teen Movie","Year":"2003","imdbID":"tt0381457","Type":"movie","Poster":"N/A"},{"Title":"Not Just Another 8 Teen Movie 2","Year":"2003","imdbID":"tt0397579","Type":"movie","Poster":"N/A"},{"Title":"Not Just Another 8 Teen Movie 3","Year":"2004","imdbID":"tt0408045","Type":"movie","Poster":"N/A"}],"totalResults":"4","Response":"True"}'
;
var JsonObject= JSON.parse(response);

//OR

 $(jQuery.parseJSON(JSON.stringify('your string')['search'])).each(function() {  
             var title = this.title;
            //do stuff
    });

Answer 3

Writing $scope.AllMoviesFound = data; means for instance you have a candy bag you try to eat the bag, that won't works.

Here your movies data are in a 'box' called data. So you have to take movies inside this box to work on it.

$scope.AllMoviesFound = data.Search

means you take Search from data and put it in your scope. You can now iterate it.

Moreover you cannot use ng-repeat as it with objects, it works only with arrays.