Typescript接口屬性更改爲來自駱駝的Pascal案例案例

我在類型腳本中使用Angular 1.4，在ASP.NET 5應用程序中使用了RXJS。我的問題極其嚴重。在運行時期間，我所有的接口屬性都從駱駝套管轉向Pascal套管。爲什麼發生這種情況以及如何避免這種情況？Typescript接口屬性更改爲來自駱駝的Pascal案例案例

請注意，我使用的承諾以從網絡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 


}

當我得到的數據返回，它的屬性使CamelCasing像這樣使它們可以訪問。

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

來源

2016-01-22 ATHER

後端必須與這種情況下的字段返回的對象是什麼。檢查你在開發工具的網絡標籤中得到了什麼。 –

它返回一個對象的字段，但所有的字段名稱都是Camel Cased，這意味着如果我嘗試訪問data.firstName中的任何代碼，它將是未定義的，但如果我寫data.FirstName它的作品（我不想做因爲在這種情況下typescript命令會拋出一個錯誤） – ATHER

那麼，如果你的後端返回的對象帶有一個名爲FirstName的字段，那麼沒有東西會神奇地將該字段轉換爲firstName。採用一個慣例，堅持它，在後端和前端。 –

最有可能的服務器使用PascalCasing，你定義不匹配由服務器返回的數據的接口。 TypeScript不會將成員名稱從PascalCase轉換爲camelCase，您必須編寫自己的邏輯。它不會在運行時拋出錯誤，因爲接口會被擦除。我建議你打破TypeScript部分的命名約定，使用PascalCase字段，這樣接口就會精確匹配數據傳輸對象。所以定義界面是這樣的：

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

和訪問像data.FirstName

字段名的另一種方式去是改變服務器的實現，爲Cleverguy25建議。

來源

2016-01-22 23:56:20

是！這是一個很好的觀點。 – ATHER

你當然可以做出這樣的改變，但是其他JavaScript程序員會問你爲什麼打破了慣例:-( – Cleverguy25

@ Cleverguy25這總是一個艱難的決定，在某些情況下，你甚至不允許更改服務器代碼，所以你會陷入這種困境，在其他情況下，這只是一個品味問題。 –

如果你的後端是的WebAPI，默認情況下，正常的JSON序列離開領域，因爲它們在你的C＃或vb.net外殼。

看看這篇文章，配置格式化程序返回駱駝套。

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

來源

2016-01-22 23:56:01 Cleverguy25

這是需要配置

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

來源

2016-01-23 10:47:13 Abhijeet

Typescript接口屬性更改爲來自駱駝的Pascal案例案例

回答

相關問題