预期的反应是一个对象,但确实如此

时间:2013-12-19 21:48:10

标签: angularjs angularjs-resource

使用resource.get()我收到此错误:

“资源配置出错。包含对象但得到数组的预期响应”。

如果我将资源配置为期望数组,我会改为:

“资源配置出错。包含数组但得到对象的预期响应”

如果我从Advanced Rest Client转储响应,那么这就是我要回来的内容:

{
    "Note": {
        "id": "1",
        "clas": "test",
        "obj_id": null,
        "note": "test"
    }
}

这看起来像是我的一个对象。奇怪的是页面仍然正常工作。但是我在控制台中收到了这个错误。

工厂:

angular.module('app').factory('Notes', function($resource) {
    var notes = $resource('/index.php/notes/:id.json');
    return {
        get: function(id, success) { notes.get({id:id}, function(resp) { success(resp.Note); }); },
        query: function() { return notes.query(); }
    }
});

控制器

angular.module('app').controller('NotesCtrl',
    function($scope, $stateParams, $state, $location, Notes) {
        Notes.get($stateParams.id,
            function(note) {
                $scope.note = note;
            },
            function(note) {
                console.log('error');
                console.log(note);
            }
        );
    });

该资源是使用CakePHP构建的,这是烘焙为您提供序列化的vanilla视图函数。

2 个答案:

答案 0 :(得分:0)

我想其他任何有类似知识的人都知道有一个解决方案(或者至少是一个解决方案),我会在这里做一个正式的答案。看看php本身不会说json,它可以生成有问题的json,其中angular无法解析。为了确保问题不是(或是)json,绕过php并欺骗json。

要欺骗api,请创建一个新控制器并将预期的json插入范围。

app.controller('NoteCtrl', function($scope) {
    $scope.allNotes = [{
        "Note": {
            "id": "1",
            "clas": "test",
            "obj_id": null,
            "note": "test"
        }       
    }];
});

用这个新范围替换对api / json的任何引用,即更改

var notes = $resource('/index.php/notes/:id.json'); 

为:

var notes = $scope.allNotes;

......然后测试。如果事情是正确的,那么它不是你的角度也不是你的json,它可能是你的php。这至少会在列表中缩小范围,以解决问题。

答案 1 :(得分:0)

我收到此错误,因为我在同一个Angular.js控制器中有两个请求:

 function UserCtrl($scope, $resource, $routeParams, API) {
   $scope.users = API.Users.query();
   $scope.user = API.Users.get({ id:$routeParams.id });
 };

因此,在一个页面上,您会收到错误,但不会收到错误。

这是另一种实现它的方法(它反映了步骤11中的电话教程 - http://docs.angularjs.org/tutorial/step_11):

<div class="container" style="border:solid 1px grey">
  <div ng-view>
  </div>
</div>

<script>
  var app = angular.module('myApp', ['ngRoute', 'ngResource']);

  app.config(function($routeProvider) {
    $routeProvider.when('/users/', { templateUrl: 'assets/users/index.html', controller: UserListCtrl });
    $routeProvider.when('/users/:id', { templateUrl: 'assets/users/show.html', controller: UserCtrl });
 });

  app.factory('API', ['$resource', function($resource) {
    return {
      Users: $resource('/users/:id.json')
    };
  }]);

  function UserListCtrl($scope, $resource, API) {
    $scope.users = API.Users.query();
  };

  function UserCtrl($scope, $resource, $routeParams, API) {
    $scope.user = API.Users.get({ id:$routeParams.id });
  };

</script>