本文介绍了Restangular与打字稿混淆当“restangularized”响应对象的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用与打字稿角1.5.x的。对于访问远程API我用restangular。作为总结,这是我的情况:

I am using Angular 1.5.x with TypeScript. For accessing a remote API I use restangular. As a summary this is my scenario:

我的API具有以下资源的http://本地主机:53384 / API /时区。发送与动词的请求获得该URL返回一个JSON数组:

My API has the following resource http://localhost:53384/api/timezones. Sending a request with the verb GET to that url returns a JSON array:

[
   {
      "code":"Dateline Standard Time",
      "name":"(UTC-12:00) International Date Line West"
   },
   {
      "code":"UTC-11",
      "name":"(UTC-11:00) Coordinated Universal Time-11"
   },
   {
      "code":"Hawaiian Standard Time",
      "name":"(UTC-10:00) Hawaii"
   }
]

现在在我的客户AngularJs以打字稿应用程序:

Now in my client AngularJs application with TypeScript:

Restangular配置是的 restangularProvider:restangular.IProvider

Restangular configuration being restangularProvider: restangular.IProvider

restangularProvider.setBaseUrl("http://localhost:53384/api");

与打字稿客户端上的TimeZone对象重新presentation

module app.blocks {
    "use strict";

    export class TimeZone {
        public code: string;
        public name: string;
    }
}

厂( restangular.IService 的)来包装restangular的所有的时区资源

Factory(restangular.IService) to wrap the restangular all 'timezones' resource

module app.services {
    factory.$inject = ["Restangular"];

    function factory(restangular: restangular.IService): restangular.IElement {
        return restangular.all("timezones");
    }

    angular
        .module("app.services")
        .factory("app.services.TimeZonesRestangular", factory);
}

服务使用的 TimeZonesRestangular 的包装其restangular功能和链接承诺返回谁以异步方式请求时区

Service that uses TimeZonesRestangular to wrap its restangular functionality and return chained promises to whoever requests timezones in an asynchronous way

module app.services {
    "use strict";

    export interface IStaticDataService {
        getTimeZones(): ng.IPromise<app.blocks.TimeZone[]>;
    }

    class StaticDataService implements IStaticDataService {
        constructor(private timeZonesRestangular: restangular.IElement) {
        }

        public getTimeZones(): ng.IPromise<blocks.TimeZone[]> {
            return this.timeZonesRestangular.getList()
                .then((timeZones: blocks.TimeZone[]) => {
                    return timeZones;
                }, (restangularError: any) => {
                    throw "Error retrieving time zones. Status: " + restangularError.status;
                });
        }
    }

    factory.$inject = ["app.services.TimeZonesRestangular"];

    function factory(timeZonesRestangular: restangular.IElement): IStaticDataService {
        return new StaticDataService(timeZonesRestangular);
    }

    angular
        .module("app.services")
        .factory("app.services.StaticDataService", factory);
}

最后在使用该服务来获得控制器中的时区异步我有这样的说法

//..other controller things not relevant for this sample
this.staticDataService.getTimeZones()
      .then((timeZones: blocks.TimeZone[]) => {
            this.timeZones = timeZones;
       });

有2个问题:


  1. 有关restangular类型定义(我安装了 TSD安装restangular --resolve --save )告诉我,successCallback在getTimeZones()方法是一个 promiseValue:任何[] ,这是很好的,因为它确实是一个数组。我认为这将是时区[]数组,打字稿正确编译,因为它接受的[] ,但debuggin当我看到successCallback承诺值的这不是时区[] 的数组。它拥有我所期望的性能( code 名称),但它也有很多其他的事情restangular杂交。该数组内的物体看起来像这样(加上一些功能):

  1. The type definition for restangular (which I installed with tsd install restangular --resolve --save) tells me that the successCallback in the getTimeZones() method is a promiseValue: any[], which is fine because it is indeed an array. I thought it would be an array of TimeZone[] and typescript compiles properly because it accepts any[], but when debuggin I see that the successCallback promised value it's not an array of TimeZone[]. It has the properties I expected (code and name) but it also has many other things restangular-ish. An object within that array looks like this (plus some functions):

{
 "code":"Dateline Standard Time",
 "name":"(UTC-12:00) International Date Line West",
 "route":"timezones",
 "reqParams":null,
 "restangularized":true,
 "fromServer":true,
 "parentResource":null,
 "restangularCollection":false
}

根据 https://github.com/mgonto/restangular/issues/150看起来好像我的反应是restangularized。某人新的可怕的描述restangular像我这样的..
我应该使用什么接口restangular类型定义重新present数组的 restangularized 时区[]

As per https://github.com/mgonto/restangular/issues/150 it looks as if my response had been "restangularized". Scary description for somebody new to restangular like myself..What interface in restangular type definition should I use to represent the array of restangularized TimeZone[] ?

有没有就如何实现与类似的东西打字稿任何的例子吗?

Is there any example on how to achieve something similar with TypeScript?

感谢您。

推荐答案

挖一点点经过进一步我发现最好的方式来处理,这是由预期类型的​​承诺值 restangular.ICollection (从 IService 阵列&LT继承;任何&GT; ),以便我能德restangularize这样的回应:

After digging a little bit further I found out that the best way to handle this is by expecting a promised value of type restangular.ICollection (which inherits from IService and Array<any>) so that I can de-restangularize the response like this:

public getTimeZones(): ng.IPromise<blocks.TimeZone[]> {
            return this.timeZonesRestangular.getList()
                .then((restangularizedTimeZones: restangular.ICollection) => {
                    return restangularizedTimeZones.plain();
                }, (restangularError: any) => {
                    throw "Error retrieving time zones. Status: " + restangularError.status;
                });
        }

现在全部的寄托,似乎要被罚款和响应,着实的承诺时区[]

Now everthing seems to be fine and the response is, indeed, a promise of TimeZone[]

这篇关于Restangular与打字稿混淆当“restangularized”响应对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-16 03:16