javascript - $资源:badcfg when calling sharepoint rest service using angular

Question

我有一个旧的示例应用程序，它调用休息服务，其内容如下:此应用程序不使用 angularJS。

var listName = "Events";

        // the url to use for the REST call.
        var url = SPAppWebUrl + "/_api/SP.AppContextSite(@target)" +

            // this is the location of the item in the parent web. This is the line
            // you would need to change to add filters, query the site etc
          //  "/web/lists/getbytitle('" + listName + "')/items?" +
            "/web/lists/getbytitle('" + listName + "')/items?$select=Title,Category,EventDate,Description,EncodedAbsUrl,ID" +
            "&@target='" + SPHostUrl + "'";

        // create  new executor passing it the url created previously
        var executor = new SP.RequestExecutor(SPAppWebUrl);

        // execute the request, this is similar although not the same as a standard AJAX request
        executor.executeAsync(
            {
                url: url,
                method: "GET",
                headers: { "Accept": "application/json; odata=verbose" },
                success: function (data) {

                    // parse the results into an object that you can use within javascript
                    var results = JSON.parse(data.body);
                    var events = [];

问题出在我的新应用程序中，我使用 Angular 创建了一个应用程序，该应用程序使用 Rest 从共享点列表中读取数据，但是我正在努力解决 $resource.query 及其选项。

我在这篇文章的标题中收到错误，BADCFG，这意味着我没有使用正确的选项，我在文档中没有找到如何在我的代码中设置 header 、接受选项。

代码如下:

App.Js

var SPHostUrl;
var SPAppWebUrl;
var ready = false;

$(document).ready(function () {
    var params = document.URL.split("?")[1].split("&");
    for (var i = 0; i < params.length; i = i + 1) {
        var param = params[i].split("=");
        switch (param[0]) {
            case "SPAppWebUrl":
                SPAppWebUrl = decodeURIComponent(param[1]);
                break;
            case "SPHostUrl":
                SPHostUrl = decodeURIComponent(param[1]);
                break;
        }
    }
});

(function () {
    "use strict";
    var app = angular.module("productManagement",
                            ["common.services",
                             "ui.router",
                             "ui.mask",
                             "ui.bootstrap"]);

    app.config(["$stateProvider",
                "$urlRouterProvider",
        function ($stateProvider, $urlRouterProvider) {
            $urlRouterProvider.otherwise("/products");

            $stateProvider
                .state("home", {
                    url: "/",
                    templateUrl: "../Scripts/app/welcomeView.html"
                })
                // Products
                .state("productList", {
                    url: "/products",
                    templateUrl: "../Scripts/app/products/productListView.html",
                    controller: "ProductListCtrl as vm"
                })
                .state("productEdit", {
                    abstract: true,
                    url: "/products/edit/:productId",
                    templateUrl: "../Scripts/app/products/productEditView.html",
                    controller: "ProductEditCtrl as vm",
                    resolve: {
                        productResource: "productResource",

                        product: function (productResource, $stateParams) {
                            var productId = $stateParams.productId;
                            return productResource.get({ productId: productId }).$promise;
                        }
                    }
                })
                .state("productEdit.info", {
                    url: "/info",
                    templateUrl: "../Scripts/app/products/productEditInfoView.html"
                })
                .state("productEdit.price", {
                    url: "/price",
                    templateUrl: "../Scripts/app/products/productEditPriceView.html"
                })
                .state("productEdit.tags", {
                    url: "/tags",
                    templateUrl: "../Scripts/app/products/productEditTagsView.html"
                })

                .state("productDetail", {
                    url: "/products/:productId",
                    templateUrl: "../Scripts/app/products/productDetailView.html",
                    controller: "ProductDetailCtrl as vm",
                    resolve: {
                        productResource: "productResource",

                        product: function (productResource, $stateParams) {
                            var productId = $stateParams.productId;
                            return productResource.get({ productId: productId }).$promise;
                        }
                    }
                })

        }]
    );
}());

ProductListrCtrl.js

(function () {
    "use strict";
    angular
        .module("productManagement")
        .controller("ProductListCtrl",
                    ["productResource",
                    ProductListCtrl]);

    function ProductListCtrl(productResource) {
        var vm = this;

        productResource.query(function (data) {
            vm.products = data;
        });

        vm.showImage = false;

        vm.toggleImage = function () {
            vm.showImage = !vm.showImage;
        }
    }
}());

产品资源.js

(function () {
    "use strict";

    angular
        .module("common.services")
        .factory("productResource",
                ["$resource",
                 productResource]);

    function productResource($resource) {
        var listName = "Products";

        // the url to use for the REST call.
        var url = SPAppWebUrl + "/_api/SP.AppContextSite(@target)" +

        // this is the location of the item in the parent web. This is the line
        // you would need to change to add filters, query the site etc
        //  "/web/lists/getbytitle('" + listName + "')/items?" +
            "/web/lists/getbytitle('" + listName + "')/items?$select=Id,productName,productCode,releaseDate,description,cost,price,category,tags,imageUrl" +
            "&@target='" + SPHostUrl + "'";

        //return $resource(url);
        //return $resource("/api/products/:productId")

        return $resource(url, {}, {
            query: { method: 'GET', isArray: true },
            create: { method: 'POST' }
        })
    }

}());

Answer 1

至于添加标题:

return $resource(url, {}, {
  query: { method: 'GET', isArray: true,
           headers: { "Accept": "application/json; odata=verbose" }
         },
  create: { method: 'POST' }
});

但是这个错误意味着不同的东西。 query 需要一个数组，而服务器可能不会返回一个数组。也许是因为缺少 header ，但在第一个示例中，有注释将结果解析为对象，这可能意味着服务器无论如何都不会返回数组。如果是这种情况，您可以添加结果转换器。