带有角度 $resource 的 SharePoint 列表上的 CRUD

Question

在我的服务中，我有一个函数可以获取 SharePoint 列表中所有项目的 ID 和标题，如下所示：

this.getList = function () {
    var deferred = $.Deferred();

    var restQueryUrl = appweburl + "/_api/lists/getByTitle('ListName')/items?$select=Id,Title";
    var executor = new SP.RequestExecutor(appweburl);
    executor.executeAsync({
        url: restQueryUrl,
        method: "GET",
        headers: { "Accept": "application/json; odata=verbose" },
        success: function (data, textStatus, xhr) {
            deferred.resolve(JSON.parse(data.body));
        },
        error: function (xhr, textStatus, errorThrown) {
            deferred.reject(JSON.stringify(xhr));
        }
    });
    return deferred;
};

但我一直在阅读有关 $resource 的信息，而且您似乎对自己的数据有更多的控制权，它更加孤立，但在将它与 SharePoint 一起使用时我找不到任何有用的帮助。

在“信用卡”示例中，他们定义了一个这样的类：

var CreditCard = $resource('/user/:userId/card/:cardId',
  {userId:123, cardId:'@id'}, {
  charge: {method:'POST', params:{charge:true}}
});

如果我有一个包含“Id”、“Title”和“Description”字段的 SharePoint 列表，称为“Items”，我该如何定义一个 Item 类，就像上面的信用卡示例一样，这样我可以“查询”该列表中的所有项目吗？

Answer 1

它不是一个完整的解决方案，您需要使用以下代码来解决问题，为了您的方便，我提供了一些链接。

这里是Link 很好很简单的文章，解释了如何使用 Rest api 和 AngularJS 在 SharePoint 2013 中获取列表数据。

Link 解释了如何使用 REST API 来通过 AngularJS 服务托管 Web。

$资源

angular.module('myApp.controllers',[]);
angular.module('myApp.controllers').controller('ResourceController',function($scope, Entry) {
  var entry = Entry.get({ id: $scope.id }, function() {
console.log(entry);
  }); // get() returns a single entry

  var entries = Entry.query(function() {
console.log(entries);
  }); //query() returns all the entries

  $scope.entry = new Entry(); //You can instantiate resource class

  $scope.entry.data = 'some data';

  Entry.save($scope.entry, function() {
//data saved. do something here.
  }); //saves an entry. Assuming $scope.entry is the Entry object  
});

函数调用的结果是一个资源类对象，默认有以下方法：

get()
query()
save()
remove()
delete()

这里需要将以下 SharePoint REST API 与 ajax 结合起来

function get(url) {
$.ajax({
    url: _spPageContextInfo.webAbsoluteUrl + url,
    type: "GET",
    headers: {
        "accept": "application/json;odata=verbose",
    },
    success: function (data) {
        console.log(data.d.results);
    },
    error: function (error) {
        alert(JSON.stringify(error));
    }
});
}

保存到 SharePoint 列表的方法

function save(url, data) {
$.ajax({
    url: _spPageContextInfo.webAbsoluteUrl + url,
    type: "POST",
    headers: {
        "accept": "application/json;odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val(),
        "content-Type": "application/json;odata=verbose"
    },
    data: JSON.stringify(data),
    success: function (data) {
        console.log(data);
    },
    error: function (error) {
        alert(JSON.stringify(error));
    }
});
}

更新 SharePoint 列表中项目的方法

function update(url, oldItem, newItem) {
$.ajax({
    url: _spPageContextInfo.webAbsoluteUrl + url,
    type: "PATCH",
    headers: {
        "accept": "application/json;odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val(),
        "content-Type": "application/json;odata=verbose",
        "X-Http-Method": "PATCH",
        "If-Match": oldItem.__metadata.etag
    },
    data: JSON.stringify(newItem),
    success: function (data) {
        console.log(data);
    },
    error: function (error) {
        alert(JSON.stringify(error));
    }
});
}

SharePoint 列表中删除项目的方法

function delete(url, oldItem) {
$.ajax({
    url: _spPageContextInfo.webAbsoluteUrl + url,
    type: "DELETE",
    headers: {
        "accept": "application/json;odata=verbose",
        "X-RequestDigest": $("#__REQUESTDIGEST").val(),
        "If-Match": oldItem.__metadata.etag
    },
    success: function (data) {

    },
    error: function (error) {
        alert(JSON.stringify(error));
    }
});
}

列出 SharePoint 列表的示例代码

var employeesApp = angular.module(‘myApp’, []);
employeesApp.controller(’employeeCtrl’, function ($scope, $http) {
$http(
    {
        method: “GET”,
        url: “/_api/web/lists/getByTitle(‘Employees’)/items”,
        headers: { “Accept”: “application/json;odata=verbose” }
    }
    ).success(function (data, status, headers, config) {
        $scope.employees = data.d.results;
    }).error(function (data, status, headers, config) {
        alert(‘Error’);
    });
});