angular - 订阅方法未触发
问题描述
我有一个 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)
解决方案
请尝试向{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 以避免需要这样做。
希望这会有所帮助!
推荐阅读
- node.js - 如何在aws上的EBS链接上添加HTTPS?
- java - 如何在keycloak上设置令牌过期时间
- c# - Swagger 在 ASP.CORE 3 中为字典生成不正确的 URL
- react-native-android - 在 react native android .file 中生成发布版本时出现以下错误 .file 已经存在
- flutter - 如何在没有选择器 Flutter 的情况下从图库中获取随机照片?
- javascript - JSDoc Typescript 声明:如何自动注册自定义元素?
- xml - 当有一些相同的标签名称时,如何使用 perl 脚本过滤 xml 标签?
- java - REST - HTTP 状态 405;方法不允许;请求方法“PUT”不支持错误
- microsoft-graph-api - GRAPH API 中太多重试和太多请求错误之间的区别
- kotlin - 如何在 Kotlin 中使用 lambda 打印消息