Question

我正在使用AngularJs在这个JSON对象中获取一些信息，特别是作者的名字和姓氏：

{
    "bookid": "1",
    "title": "Spring In Action",
    "publisher": "Manning Publications Co.",
    "isbn": "978-1-935182-35-1",
    "owner": "Catalyst IT Services",
    "publishyear": "2011",
    "image": "C:/imagefolder/spring-in-action.jpg",
    "description": "Totally revised for Spring 3.0, this book is a...",
    "author": [
        {
            "authorid": "1",
            "firstname": "Craig",
            "lastname": "Walls",
            "description": "Craig Walls has been professionally developing software for over 17 years (and longer than that for the pure geekiness of it). He is the author of Modular Java (published by Pragmatic Bookshelf) and Spring in Action and XDoclet in Action (both published by (...)"
        }
    ],
    "media": [
    ],
    "tags": [
        {
            "tagid": "1",
            "tagname": "Java"
        },
        {
            "tagid": "5",
            "tagname": "Spring"
        }
    ],
    "copies": [
        {
            "bookcopyid": "2",
            "location": "Beaverton",
            "status": "available"
        }
    ]
}

我现在的代码是（由bosco2010在此plunker（http://plnkr.co/edit/GbTfJ9）中提供）：

var app = angular.module('app', []);

app.factory('JsonSvc', function ($http) {
  return {read: function(jsonURL, scope) {
        return $http.get(jsonURL).success(function (data, status) {
            scope.data = data.author;      

        });
    }};
});

app.controller('MainCtrl', function($scope, JsonSvc) {


    JsonSvc.read('data.json', $scope).then(function () {
    $scope.nestedObj = $scope.data;  

    });


    $scope.name = "world";


});

Answer 1

要获取名字和姓氏，您需要引用author[0].firstname和author[0].lastname。

Answer 2

var app = angular.module('app', []);

app.factory('JsonSvc', function ($http) {
  return {read: function(jsonURL) {
        return $http.get(jsonURL);
    }};
});

app.controller('MainCtrl', function($scope, JsonSvc) {

  // The return object from $http.get is a promise.  I used .then() 
  // to declare $scope.nestedObj after the http call has finished.
    JsonSvc.read('data.json').then(function (data) {
      console.log(data.data);
    $scope.nestedObj = data.data.level1;  
    });

  // ensure app is working
    $scope.name = "world";

  // Using nested obj within declared scope var doesn't work
  // Uncomment below to break whole app

  // Using nested obj in a function works but throws TypeError
  // Declaring $scope.data.level1.level2 = [] first helps here
  $scope.getLen = function () {
      return $scope.nestedObj ? $scope.nestedObj.level2.length : ''; // return an empty string if the callback didn't happen yet
  };

});

简而言之，同时使用$ htttp服务返回的promise的success（）函数和then（）函数是不正确的。此外，将范围作为参数传递给您的服务并尝试在其中进行修改是错误的。

如果您需要直接在服务和控制器之间进行通信，可以使用$ rootScope，$ broadcat或两者。我修补了你的代码，现在它可以工作了。

普拉克： http://plnkr.co/edit/PlJZZn?p=preview

如何使用angularJS深入了解JSON对象？

2 个答案: