$resource .then() 收到资源后抛出错误

Question

我正在尝试在收到的角度 $resource 和我的控制器之间添加一层抽象。我必须执行一些操作，例如过滤，所以我设置了一个服务来执行这些中间功能。

我能够毫无问题地设置第一个资源调用：

/**
 * Get Grid
 *
 * retrieves grid resource and serializes the grid, rows, columns and widgets themselves
 */
this.getGrid = function() {
    var gridResource = new GridResource();
    var response = gridResource.$query();

    var accGrid = new Grid;

    response.then(function(response) {
        angular.forEach(response.grid, function(row) {
            var accRow = new Row;

            angular.forEach(row.columns, function(column) {
                //Setting up new Column
                var accColumn = new Column();
                accColumn.setId(column.id);

                //Setting up new Widget(s)
                var accWidget = new Widget;
                accWidget.setId(column.widget.id);
                accWidget.setName(column.widget.name);
                accWidget.setType(column.widget.type);
                accWidget.setChildren(column.widget.children);
                accWidget.setVars(column.widget.vars);

                accColumn.addWidget(accWidget);
                accRow.addColumn(accColumn);
            });

            accGrid.addRow(accRow);
        });
    });
    return accGrid;
};

这将返回包含所有填充部分的 Grid 对象。

但是，当我尝试在不同的端点上执行相同的方法时，Angular 会抱怨：

http://puu.sh/eUSbx/3c15a8b13a.png

我在方法中只到了这一点：

/**
 * Get all Widgets
 *
 * Retrieves all widgets belonging to the route, regardless if they are in the canvas or not
 */
this.getWidgets = function() {
    var widgets = new Array();
    var widgetResource = new WidgetResource();
    var response = widgetResource.$query();


    response.then(function(response) {
        console.log(response);
    });

    return widgets;
};

如果您想了解 $resource 本身：

designService.factory('GridResource', ['$resource',
function($resource){
    return $resource('view/canvas', {},
        {
            query: { method:'GET' },
            save: { method:'POST' }
        });
}]);

designService.factory('WidgetResource', ['$resource',
function($resource) {
    return $resource('view/widget', {},
        {
            query: { method:'GET', isArray: true }
        });
}]);

我是一名 PHP 人，正在进入前端 JS 奇妙的怪异世界，并且真的可以使用指针：sweaty-smile：谢谢！

** 更新 ** 我也了解了 Angular 如何使用 then 来捕获错误响应，所以我更新了我的查询：

    widgetResource.$query().then(
        function(response) {
            console.log(response);
        }, 
        function(error) {
            console.log(error);
        }
    );

产生此错误的原因：

http://puu.sh/eUYYx/998c73600a.png

Answer 1

** 得到答案**

Angular 真是太他妈挑剔了！问题是我试图从已经给出的资源对象中创建一个新的资源对象。直接将response 分配给WidgetResource.query() 的结果就足够了。这可能是因为我将WidgetResource.query() 的isArray 属性设置为true。

/**
 * Get all Widgets
 *
 * Retrieves all widgets belonging to the route, regardless if they are in the canvas or not
 */
this.getWidgets = function() {
    var widgets = new Array();
    //var widgetResource = new WidgetResource();
    var response = WidgetResource.query();

    response.$promise.then(
        function(response) {
            console.log(response);
        }, 
        function(error) {
            console.log(error);
        }
    );

Answer 2

你的代码看起来不错，看看你的控制器中的依赖注入。您可能遗漏了一个或拼写错误？