首页 > 解决方案 > 订阅方法未触发

问题描述

我有一个 Angular 应用程序,它由一个表单和一个提交按钮组成。当我填写表单并提交时,如果数据库注入操作成功,我希望它在清理表单后立即返回成功消息。为此,我使用了该subscribe方法,但是,代码永远不会进入该方法,并且不会触发所需的功能。

insertRecord(form : NgForm){
    this.service.postAsset(form.value).subscribe(res =>{
    this.toastr.success('Inserted succesfull', 'Asset Register');
    this.resetForm(form);
    });
  }

postAsset方法成功运行并将值添加到数据库表中,但是该subscribe方法永远无法正常工作。为什么会导致这种情况?任何帮助表示赞赏。

编辑:根据要求,postAsset()实施;

postAsset(formData: Asset){
    return this.http.post(this.rootURL + '/Create', formData);
  }

编辑2:提交表单后几秒钟发生错误;

SyntaxError: Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at XMLHttpRequest.onLoad (http://localhost:4200/vendor.js:13804:51)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2781:31)
    at Object.onInvokeTask (http://localhost:4200/vendor.js:59285:33)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2780:60)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (http://localhost:4200/polyfills.js:2553:47)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (http://localhost:4200/polyfills.js:2856:34)
    at invokeTask (http://localhost:4200/polyfills.js:4102:14)
    at XMLHttpRequest.globalZoneAwareCallback (http://localhost:4200/polyfills.js:4139:21)

标签: angulartypescript

解决方案


请尝试向{responseType: 'text'}您的 HttpClient POST 请求添加选项:

postAsset(formData: Asset) {
  return this.http.post(this.rootURL + '/Create', formData, { responseType: 'text' });
}

这在请求非 JSON 数据下的 HttpClient 文档中有所提及。

您的请求似乎正在发生的事情是服务器返回的不是 type application/json。除非您指定不同的类型,否则HttpClient 默认尝试JSON.parse()在幕后有效执行。尝试对JSON.parse()非 JSON 字符串执行操作会导致您遇到错误。

我建议application/json尽可能从您的服务器返回 type of 以避免需要这样做。

希望这会有所帮助!


推荐阅读