如何将对象模型（其中包含对象模型数组）传递给 API 以作为参数插入

Question

我是 angular 的新手，试图为我的对象模型创建参数，每当我对对象进行字符串化时，它都会生成一个 API 不接受的大字符串。我应该怎么办..？

这里是我要转换成参数的对象

{
    "qaevaluationid": 1,
    "agentid": 1,
    "callerid": "1234",
    "calledon": "02/13/2020 10:38:14 AM",
    "duration": "304",
    "overallfeedback": "adasdasd",
    "isfatal": false,
    "fatalcallreasonid": "3",
    "evaluationtypeid": "1",
    "callratings": [{
        "callratingid": 1,
        "createdby": 1,
        "createdbyname": "john",
        "createdon": null,
        "evaluationfactorid": 8,
        "is_deleted": "F",
        "modifiedby": -1,
        "modifiedbyname": "",
        "modifiedon": null,
        "qaevaluationid": 1,
        "rating": "7"
    }, {
        "callratingid": 2,
        "createdby": 1,
        "createdbyname": "john",
        "createdon": null,
        "evaluationfactorid": 9,
        "is_deleted": "F",
        "modifiedby": -1,
        "modifiedbyname": "",
        "modifiedon": null,
        "qaevaluationid": 1,
        "rating": "6"
    }, {
        "callratingid": 3,
        "createdby": 1,
        "createdbyname": "john",
        "createdon": null,
        "evaluationfactorid": 10,
        "is_deleted": "F",
        "modifiedby": -1,
        "modifiedbyname": "",
        "modifiedon": null,
        "qaevaluationid": 1,
        "rating": "8"
    }],
    "createdby": 1,
    "createdbyname": "John",
    "createdon": null,
    "modifiedby": -1,
    "modifiedbyname": null,
    "modifiedon": null,
    "is_deleted": "F"
}

在 TypeScript 中我是这样做的

this.httpOptions.params = new HttpParams();

this.httpOptions.params = this.httpOptions.params.set('qaEval', JSON.stringify(qaevaluation)); 

return this._httpClient.post<APIResponse<QAEvaluation>>(this.myAppUrl + 'QAEvaluation/insert', { qaEval: qaevaluation }, this.httpOptions)
      .pipe(retry(1), catchError(this.errorHandler));

出现这个错误

"Http failure response for https://localhost:44304/QAEvaluation/insert?qaEval=%7B%22qaevaluationid%22:-1,%22agentid%22:1,%22callerid%22:%221234%22,%22calledon%22:%2202/13/2020%2010:38:14%20AM%22,%22duration%22:%22304%22,%22overallfeedback%22:%22adasdasd%22,%22isfatal%22:false ……. This goes on and on : 404 OK"

Answer 1

您的路径是正确的，但是您在请求的 URL 上添加了所有 json 对象作为查询参数。在 POST 请求中，您想将数据放在 HTTP 正文中。

我认为如果您省略第二行就可以了。另请查看 HttpClient 文档以获取示例和正确的语法。

Answer 2

您很可能需要将您的 URL 代理到您的 api。 Angular 使用特定端口托管在您的开发环境中，在您的情况下 44304.

检查：https://angular.io/guide/build

You can use the proxying support in the webpack dev server to divert certain URLs to a backend server, by passing a file to the --proxy-config build option. For example, to divert all calls for http://localhost:4200/api to a server running on http://localhost:3000/api, take the following steps.

Create a file proxy.conf.json in your project's src/ folder.

Add the following content to the new proxy file:

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false
  }
}

In the CLI configuration file, angular.json, add the proxyConfig option to the serve target:

"architect": {
  "serve": {
    "builder": "@angular-devkit/build-angular:dev-server",
    "options": {
      "browserTarget": "your-application-name:build",
      "proxyConfig": "src/proxy.conf.json"
    },

运行发球

Answer 3

更新了我的控制器以接受带有动态对象的 FormBody 并从 typescript 中删除了 http 参数，例如..它成功了。

return this._http.post<APIResponse<QAEvaluation>>(this.myAppUrl + 'QAEvaluation/insert', { qaEval: qaevaluation }, { headers: new HttpHeaders({ 'Content-Type': 'application/json; charset=utf-8' }) })
          .pipe(retry(1), catchError(this.errorHandler));

还使用序列化解析成我的结果对象

    public ActionResult Insert([FromBody]dynamic qaEval)
            {            

                    var objModel1 = Newtonsoft.Json.JsonConvert.DeserializeObject(qaEval.ToString());

                    var objModel = Newtonsoft.Json.JsonConvert.SerializeObject(objModel1.qaEval);

    QAEvaluationModel model = Newtonsoft.Json.JsonConvert.DeserializeObject<Models.QAEvaluationModel>(objModel);

qaEvaluationRepository.Add(model);

return Ok(new Models.APIResponse
                    {
                        HasError = false,
                        Message = "Success",
                        Content = null
                    });
    }

如何将对象模型（其中包含对象模型数组）传递给 API 以作为参数插入

How to pass an Object Model (that has an Array of Objects Models in it) to API for insert as Params

c#

angular

typescript

api

http-options-method