Question

我正在使用typescript + angularjs和web API创建Web应用程序。我正在使用$ resource与Web API进行交互。我可以通过在save（）中传递自定义对象作为参数来获取数据起诉查询操作但无法保存数据。而是获得“405 Method Not Allowed”错误。有人可以建议如何实现这个目标吗？

以下是我服务的代码：

module app.common {
interface IDataAccessService {
    getResource(): ng.resource.IResourceClass<IAdopterResource>;
}

export interface IAdopterResource extends ng.resource.IResource<app.adopter.IAdopter> {
}

export class DataAccessService implements IDataAccessService {

    static $inject = ["$resource"];
    constructor(private $resource: ng.resource.IResourceService) {

    }
    getResource(): ng.resource.IResourceClass<IAdopterResource> {
        return this.$resource("http://myapp/api/adopter/GetAdopters", { type: '@type', name: '@name' }, { 'query': { method: 'GET', isArray: true } });
    }

    getAdopterById(): ng.resource.IResourceClass<IAdopterResource> {
        return this.$resource("http://myapp/api/adopter/GetAdopterById", { id: '@id' }, { 'query': { method: 'GET', isArray: true } });
    }

    saveAdopter(): ng.resource.IResourceClass<IAdopterResource> {
        return this.$resource("http://myapp/api/adopter/SaveAdopter", { obj: '@obj' }, { 'save': { method: 'POST', headers: { 'Content-Type': 'application/json; charset=utf-8'}, isArray: true } });
    }

}
angular.module("common.services")
    .service("dataAccessService", DataAccessService);
}

以下是控制器类的代码：

class AdopterDetailController {
    public adopters: IAdopter;
    public $router: any;
    static $inject = ["dataAccessService"];
    constructor(private dataAccessService: app.common.DataAccessService) {
        console.log("Adopter detail controller loaded");

    }

    $routerOnActivate(next) {

        var AdopterList = this.dataAccessService.getAdopterById();
        AdopterList.query({ id: next.params.id }, (data: adopter.AdopterMaster[]) => {
            this.adopters = data[0];
        });
    }

    OnSave() {

        var adopterResource = this.dataAccessService.saveAdopter();
        adopterResource.save({ obj: this.adopters }, (data: app.adopter.IAdopter[]) => {
            alert(data[0]);
        });
    }

    //errorOnSaveCallback(): void{
    //    alert('error');
    //}
    OnCancel(): void {
        alert('cancel click start');
        this.$router.navigate(['AdopterList']);
    }
}

$ routerOnActivate（next）中的代码正常工作并获取所请求ID的数据，但OnSave（）给出“405 Method Not Allowed”错误（参见附件截图）

注意：我使用angular 1.5

在打字稿中编写组件

修改经过一番研究，我发现了“部分”的答案。以下是我的网络API的代码

   [HttpPost]
    public IHttpActionResult SaveAdopter(Adopter obj)
    {
        // some code
    }

现在api是单独的项目并且单独部署，即corss-origin。因为$ resouce的保存操作是使用“OPTION”方法而不是“POST”方法发送请求，即使明确提到“POST”。

现在由于请求不是“POST”，它不会在请求正文中发送对象。而是$ resource在JSON中转换对象并将其作为查询字符串发送。因此，“obj”参数始终为null。

在这种情况下如何在“obj”中获取数据？

注意： 此代码在其他开发机器上运行正常。即使用“POST”方法而不是“OPTIONS”发送请求。可能是每个浏览器以不同的方式处理CORS请求。

如何使用打字稿中$ resource服务的保存操作来保存数据

0 个答案: