打字稿界面属性从 Camel Case 更改为 Pascal Case

Question

我正在使用带有类型脚本的Angular 1.4，并在 ASP.NET 5应用程序中使用RXJS。我遇到了非常棘手的问题。在运行时，我的所有接口属性都从驼峰外壳转换为 Pascal 外壳。为什么会这样快乐，如何避免这种情况？

请注意，我正在使用承诺从 web api 获取数据，像这样进行调用

public GetDataFromAPI(request: Messages.IRequest): Observable<Messages.IResponse> {
    let result: IPromise<Messages.IResponse>;
    result = this.$http.post("http://api.domain.com/GetData", request).then(
        (response: ng.IHttpPromiseCallbackArg<Messages.IResponse>) => {
            return response.data;
        }
    ); 
 return Observable.fromPromise(result).retry(3);
}

这是我定义接口的方式

export interface IResponse{
     firstName : string;
     lastName : string;
     age : number

}

当我取回数据时，它的属性是像这样的骆驼，使它们可以访问。

response.data.FirstName
response.data.LastName
response.data.Age

Answer 1

很可能服务器使用 PascalCasing，并且您定义的接口与服务器返回的数据不匹配。TypeScript 不会将成员名称从 PascalCase 转换为 camelCase，您必须编写自己的逻辑。它也不会在运行时抛出错误，因为接口会被擦除。我建议你打破 TypeScript 部分中的命名约定，使用 PascalCase 字段，这样接口就会与数据传输对象完全匹配。因此，请像这样定义接口：

export interface IResponse {
    FirstName : string;
    LastName : string;
    Age : number;
}

并访问字段名称，例如data.FirstName

另一种方法是更改服务器实现，正如 Cleverguy25 所建议的那样。

Answer 2

如果您的后端是 WebApi，则默认情况下，正常的 Json 序列化会将字段保留在 c# 或 vb.net 大小写中。

查看本文以配置格式化程序以返回骆驼外壳。

http://richarddingwall.name/2012/03/10/returning-camelcase-json-from-asp-net-web-api/

Answer 3

以下是需要配置的内容

HttpConfiguration config = new HttpConfiguration();
var jsonFormatter = config.Formatters.OfType<JsonMediaTypeFormatter>().First();
jsonFormatter.SerializerSettings.ContractResolver = new CamelCasePropertyNamesContractResolver();
jsonFormatter.SerializerSettings.Formatting = Formatting.Indented;