函数返回字符串而不是 json 对象答案

【问题标题】：Function returning string instead of json object函数返回字符串而不是 json 对象
【发布时间】：2019-07-08 22:20:49
【问题描述】：

我正在开发/扩展 TOH。我有一个 add 方法想要将新英雄推送到数组上，然后将用户返回到列表中。

对 addHero 的调用结果以 JSON 英雄的形式在双刻度内返回，因此以字符串形式返回。

我已经阅读了很多似乎指向

的文章

angular.toJson
or 
.map(response=> response.JSON())

这些都不起作用。

这是我的 heros.component.ts 的摘录

  add(name: string): void {
    name = name.trim();
    if (!name) { return; }
    this.heroService.addHero({ name } as Hero)
      .subscribe(hero =>
      {
        this.heroes.push(hero);
        this.location.go('/Heroes');
      }
      );
  }

和 hero.service.ts 这显然返回了一个 Hero 对象......

  addHero (hero: Hero): Observable<Hero> {
    return this.http.post<Hero>(this.heroesUrl, hero, httpOptions).pipe(
      tap((hero: Hero) => console.log(`added hero w/ id=${hero.id}`)),
      catchError(this.handleError<Hero>('addHero'))
    );
  }

返回时，结果成功推送到数组中，但用引号括起来。

这方面的 UI 证据是列表底部有一个空白条目，因为该最终数组元素上没有 .Name 属性。

如果我刷新页面，每个人都会被加载为 json。

简单的问题，但我似乎找不到答案。经历了许多涉及 ng2、php 等的 S/O 问题，但似乎没有一个解决 ng6，或者提供我可以带走的线索。如果他们这样做，我想念它。

【问题讨论】：

console.log(`added hero w/ id=${hero.id}`) 的输出是什么？
这就是问题所在。 hero.id 返回 null，因为唯一已初始化的属性是 hero.name。在这一点上，我什至不是财产。真正的问题是返回类型。

标签： json angular typescript

【解决方案1】：

如果您想将 json 解析为 javascript 对象，您可以使用 JSON.parse(response.JSON())

我猜 response.JSON() 将响应返回为 json，然后需要对其进行解析

编辑：您可能只需删除 map => response.JSON() 。由于 Angular httpClient 已经解析了它

【讨论】：

是的，地图线没有帮助。不应该出现在这篇文章中。在订阅范围内，我把这个...var hero2 = JSON.parse(response.JSON);编译器抱怨响应。您能否扩展您的答案以包含原始代码并显示此行适合的位置。关于所有 rxjs 语法是如何工作的，我脑海中的灯泡还没有熄灭……

【解决方案2】：

问题是服务中例程的返回类型。

@youris 的问题让我更加关注这项服务。

问题是默认响应没有正确编码为 utf8 和 'text/html'

这是更正后的代码。

Public Function add(mh As mHero) As CustomJsonStringResult

   Dim h As New TOHbos.Hero()
    h.name.Value = mh.name
    h.Save()
    Return JsonStringResultExtension.JSONString(Me, h.JSON, HttpStatusCode.OK)
End Function

在这篇文章中，引用的 JsonStringResultExtension 归功于 @NKosi。（包含代码以方便参考）

public static class JsonStringResultExtension {
   public static CustomJsonStringResult JsonString(this ApiController controller, string jsonContent, HttpStatusCode statusCode = HttpStatusCode.OK) {
        var result = new CustomJsonStringResult(controller.Request, statusCode, jsonContent);
        return result;
    }

    public class CustomJsonStringResult : IHttpActionResult {
        private string json;
        private HttpStatusCode statusCode;
        private HttpRequestMessage request;

        public CustomJsonStringResult(HttpRequestMessage httpRequestMessage, HttpStatusCode statusCode = HttpStatusCode.OK, string json = "") {
            this.request = httpRequestMessage;
            this.json = json;
            this.statusCode = statusCode;
        }

        public Task<HttpResponseMessage> ExecuteAsync(CancellationToken cancellationToken) {
            return Task.FromResult(Execute());
        }

        private HttpResponseMessage Execute() {
            var response = request.CreateResponse(statusCode);
            response.Content = new StringContent(json, Encoding.UTF8, "application/json");
            return response;
        }
    }
}

进行这些更改，结果是 json，它被正确推送到数组，并正确显示在英雄列表中。

【讨论】：