Mapping properties of C# ASPNET WebApi objects to Angular 2,

I reprogrammed the Angular 2 heroes tutorial so that is runs within an ASP.NET webapplication with a Web API and communicates with that Web API instead of the in-memory web API. Everything works well. Only one question remains:

In the service environment of ASP.NET and in the Angular environment, I work with the object Hero. The naming convention of properties in C# objects is to start a propertyname with a capital letters. The naming convention in JS is to start a propertyname with lower case. I prefer follow this conventions in my coding. If I do this the objects of course are not proper deserialized anymore at the receiving site. How is usually dealed with this ?

The get (array) in the ASP.NET controller:

    // GET api/heroes 
public HttpResponseMessage Get()
{
  String heros =  JsonConvert.SerializeObject(GetHeroes().ToArray<Hero>());
  return new HttpResponseMessage()
  {
    Content = new StringContent(heros, System.Text.Encoding.UTF8, "application/json")
  };
}

GetHeroes() returns a list of Hero:

    public class Hero
{
  public int id { get; set; }
  public string name { get; set; }
}

The code in the hero.service.ts:

 getHeroes(): Promise<Hero[]> {
  return this.http.get(this.heroesUrl)
      .toPromise()
      .then(response => response.json() as Hero[])
      .catch(this.handleError);  }

and finally the hero class in hero.ts:

export class Hero {  id: number;  name: string;}

The raw code that the webservice delivers for the get is :

[{"id":0,"name":"Zero"},{"id":11,"name":"Mr. Nice"},{"id":12,"name":"Narco"},{"id":13,"name":"Bombasto"},{"id":14,"name":"Celeritas"},{"id":15,"name":"Magneta"}]

The question is how can I keep using in C# (this now causes problems)

    public class Hero
{
  public int Id { get; set; }
  public string Name { get; set; }
}

if i do this I do not get any error. It just returns the 6 objects in the browser, only the content of the records is not displayed.Like this: