带有角$资源的SharePoint列表上的CRUD

时间:2015-09-01 06:31:06

标签: angularjs sharepoint

在我的服务中,我有一个函数来获取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时我找不到任何有用的帮助。< / p>

在“信用卡”示例中,他们定义了这样一个类:

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

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

1 个答案:

答案 0 :(得分:2)

它不是一个完整的解决方案,您需要使用以下代码,我为了您的方便而引用一些链接。

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

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

$ resource

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’);
    });
});