title: Output same JSON as in ApiController in Razor view
body: <p>I am trying to output JSON directly in my Razor view. The object being serialized is <code>IEnumerable&lt;ItemDto&gt;</code> (see definition below). I want to serialize it to identical JSON that would be returned from an <code>ApiController</code>. Here is what I have tried: </p>
  
  <ul>
  <li>When using <code>@Json.Encode(theValue)</code>, it ignores the <code>DataMember</code>, so the properties get the wrong names (uppercase first letter).</li>
  <li>When using <code>DataContractJsonSerializer</code> (and castingthe <code>IEnumerable&lt;ItemDto&gt;</code> to <code>IList&lt;ItemDto&gt;</code>), it outputs the <code>ImageDto.Sizes</code> as <code>[{ Key: 'foo', Value: &lt;object&gt; }]</code>, but the ApiController correctly does <code>{ 'foo': &lt;object&gt; }</code>.</li>
  </ul>
  
  <p>Here are my classes:</p>
  
  <pre><code>    [DataContract]
      public class ItemDto
      {
          [DataMember(Name = "id")]
          public int Id { get; set; }
  
          [DataMember(Name = "title")]
          public string Title { get; set; }
  
          [DataMember(Name = "image")]
          public ImageDto Image { get; set; }
  
          [DataMember(Name = "price")]
          public decimal Price { get; set; }
      }
  
      [DataContract]
      public class ImageDto
      {
          [DataMember(Name = "id")]
          public Guid Id { get; set; }
          [DataMember(Name = "sizes")]
          public Dictionary&lt;String, ImageSizeDto&gt; Sizes { get; set; }
      }
  
      [DataContract]
      public class ImageSizeDto
      {
          [DataMember(Name = "url")]
          public string Url { get; set; }
          [DataMember(Name = "w")]
          public int Width { get; set; }
          [DataMember(Name = "h")]
          public int Height { get; set; }
      }
  </code></pre>
  
  <p>The objective is to avoid a separate <code>GET</code> request for data that is necessary on almost every page.</p>
  
  <p>Desired JSON:</p>
  
  <pre><code>[{"id":6,
   "title":"Foo bar baz",
   "image":
      {"id":"fb2a3b4a-5ae5-4d9d-baff-72e107aa6e9c",
       "sizes":
          {"Original": {"url":"http://example.com/a", "w":-1, "h":-1},
           "Thumbnail": {"url":"http://example.com/b", "w":130, "h":73},
           "LargeThumbnail": {"url":"http://example.com/c", "w":220,"h":124},
           "Popup": {"url":"http://example.com/d", "w":256, "h":256},
           "FullWidth": {"url":"http://example.com/e", "w":930, "h":524}}},
   "price":79}]
  </code></pre>