如何使用angularJS深入JSON对象？

我使用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（）中提供）：

---

要获取名字和姓氏，您需要引用

作者[0]。firstname

和

作者[0]。lastname

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
  };

});

简而言之，既使用success（）函数，又使用$htttp服务返回的promise的then（）函数是不正确的。 此外，将范围作为参数传递给服务并试图在那里修改它是错误的

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

砰的一声：

---

bosco2010为plunker提供了另一个问题，只是为了澄清。谢谢@thomastuts，所以如果我得到了不止一本书，那么我就必须选择作者[n]了，对吗？

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
  };

});