Angular 错误配置错误：[$resource:badcfg] 查询

Question

我正在尝试将 spotify api 与 node js 和 angular js 连接。每当我尝试获取特定艺术家的详细信息时都会收到此错误。

app.js

 var app = angular.module('angularjs-starter', ['jsonService', 'ngRoute', 'ngResource'])

app.controller('MainCtrl', function($scope, JsonService) {
    //JsonService.get(function(data) {
    //   $scope.name = data.artists.href;
    // $scope.children = data.artists.items;
    //}); 

    $scope.searchShow = () => {
        JsonService.search.query({
            show: $scope.showname
        }, (response) => {
            console.log(response);
            //   $scope.name = response.artists.href;
            $scope.childr = response;
            $scope.children = response;

        })
    }
    $scope.showDetails = (id) => {
        console.log(id);
        JsonService.detail.query({

            details: id
        }, (response) => {
            console.log(response);
            //   $scope.name = response.artists.href;

        })
    }

});
app.config(['$locationProvider', function($locationProvider) {
    $locationProvider.hashPrefix('')
}])
app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {

    $routeProvider
        .when('/', {
            templateUrl: 'views/search.html',
            controller: 'MainCtrl'
        })
        .when('/details', {
            templateUrl: 'views/details.html',
            controller: 'MainCtrl'
        })
        .otherwise({
            redirectTo: '/'
        })

}])

service.js

angular.module('jsonService', ['ngResource'])
    .factory('JsonService', function($resource) {
        return {

            search: $resource('/api/search'),
            detail: $resource('/api/details')
        }
    });

routes.js-来自节点 js 服务器

const
    express = require('express'),
    path = require('path'),
    router = express.Router(),
    superagent = require('superagent')

module.exports = () => {

    router.get('/api/search', (req, res) => {
        const { show } = req.query // this is the same as const show = req.query.show
        console.log(show);
        superagent
            .get('https://api.spotify.com/v1/search?q=' + show + ':&type=artist')
            .end((err, response) => {
                if (err) {
                    res.send(err);
                    console.log(err);
                } else {
                    console.log(response.body.artists.items);
                    res.json(response.body.artists.items);

                }

            })
    })


    router.get('/api/details', (req, res) => {
        const { details } = req.query // this is the same as const show = req.query.show
        console.log(details);
        superagent
            .get('https://api.spotify.com/v1/artists/' + details)
            .end((err, response) => {
                if (err) {
                    res.send(err);
                    console.log(err);
                } else {
                    res.json(response.body);

                }

            })
    })
    router.get('*', (req, res) => {
        res.sendFile(path.join(__dirname, '../client/index.html'))
    })

    return router
}

Node js 能够从细节中获取值，但我无法将值获取到 ui

Answer 1

当 API 返回单个对象时，使用get 操作方法：

$scope.showDetails = (id) => {
    console.log(id);
    //JsonService.detail.query({
    //USE get action method
    JsonService.detail.get({

        details: id
    }, (response) => {
        console.log(response);
        //   $scope.name = response.artists.href;

    })
}

当 API 返回一个数组时，使用query 操作方法。

错误：$resource:badcfg

响应与配置的参数不匹配

说明

当$resource 服务需要一个可以反序列化为数组但接收对象的响应时会发生此错误，反之亦然。默认情况下，所有资源操作都需要对象，除了 query 需要数组。

要解决此错误，请确保您的 $resource 配置与从服务器返回的数据的实际格式匹配。

有关详细信息，请参阅$resource API reference documentation。

— AngularJS Error Reference - $resource:badcfg