post - 无法发送 POST 请求。无法读取未定义的属性“帖子”
问题描述
所以,我已经解决了 GitHub 和 StackOverflow 上的大部分类似问题。
在my issue.component.ts
文件中,我已将下拉菜单的值绑定到变量issueInformation
。现在,我需要将此数据发送到服务器,并且我正在为此使用发布请求。
这是我的issue.component.ts
文件:
import { Component, OnInit, DoCheck } from '@angular/core';
import { IssuesService } from '../issues.service';
import { HttpClientModule } from '@angular/common/http';
import { Http } from '@angular/http';
@Component({
selector: 'app-issue',
templateUrl: './issue.component.html',
styleUrls: ['./issue.component.css']
})
export class IssueComponent implements OnInit, DoCheck {
issueInfo: any[] = [];
issueInformation: any;
httpClient: any;
http: any;
constructor(private issue: IssuesService) { }
ngDoCheck(): void {
console.log('issue:', this.issueInformation);
}
ngOnInit() {
this.getIssues();
}
getIssues() {
console.log('issue::', this.issueInformation);
this.issue.allIssues().
subscribe(
data2 => {
this.issueInfo = data2.Issues;
},
err => console.log(err),
() => console.log('complete')
);
}
}
因为,我是 Angular 的新手,所以我尝试了一个带有 POST 请求的示例,并在getIssues()
函数之后将其添加到此文件中:
doPOST() {
console.log("POST");
let url = `${this.apiRoot}/post`;
this.http.post(url, {moo:"foo",goo:"loo"}).subscribe(res => console.log(res.json()));
}
我还尝试(change)="doPOST($event.target.value)"
在 HTML 中添加到我的下拉选择行。
我得到的错误是:
AppComponent.html:1 ERROR TypeError: Cannot read property 'post' of undefined
at IssueComponent.getIssues (issue.component.ts:30)
at IssueComponent.ngOnInit (issue.component.ts:24)
at checkAndUpdateDirectiveInline (core.js:24489)
at checkAndUpdateNodeInline (core.js:35151)
at checkAndUpdateNode (core.js:35090)
at debugCheckAndUpdateNode (core.js:36112)
at debugCheckDirectivesFn (core.js:36055)
at Object.eval [as updateDirectives] (AppComponent.html:7)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:36043)
at checkAndUpdateView (core.js:35055)
我尝试了以下方法:
constructor{private issue: IssuesService,private http: Http}
但这对我不起作用。
我还尝试在文件中移动 doPOST() 函数,issues.service.ts
但我无法在issue.component.ts
文件中调用它。
这是issues.service.ts
文件:
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import {Response, Headers, RequestOptions} from '@angular/http';
import { Observable} from 'rxjs';
import { IssueComponent } from './issue/issue.component';
@Injectable({
providedIn: 'root'
})
export class IssuesService {
url = 'http://localhost:8080/issueTypes';
_baseUrl = 'http://localhost:8080';
constructor(private http: HttpClient) { }
allIssues(): Observable<any> {
return this.http.get(this.url);
}
doPost() {
console.log('POST');
const url = '/api/issue';
this.http.post(url, {moo: 'foo', goo: 'loo'}).subscribe(res => console.log(res.json()));
}
}
有人可以告诉我出了什么问题吗?如果我从一开始就错了,那么请告诉我如何将值发送回issueInformation
服务器?
解决方案
在花了一整天试图解决这个问题后,我找到了解决方案:
constructor(private issue: IssuesService, private httpClient: HttpClient) { }
添加后,POST请求可以放在同一个文件中issue.component.ts
,如下所示:
postIssue() {
this.httpClient.post('http://localhost:8080/uploadFile',
{issueInformation: this.issueInformation}).subscribe((data: any) =>
console.log(data));
}
推荐阅读
- apache-nifi - NiFi动态属性使用
- sql - 在 Oracle SQL 数据库中删除后如何删除“浪费的行”
- laravel - Laravel如何更新共享主机中的视图?
- r - 是否可以在没有平方矩阵 (R) 的情况下使用 chorddiag 创建和弦图?
- javascript - 无法使用 Angular 显示实时摄像机 RTSP 流
- javascript - 关闭上一个/选项卡后打开 URL 的 Javascript?
- python - 从 windows-start 启动 Python 程序会更改路径(os.listdir)
- java - 错误:放置在循环中时找不到字符串数组的符号
- android - 无法为类 gcandb 调用无参数构造函数使用 Gson 为该类型注册 InstanceCreator 可能会解决此问题
- php - PHP/HTML:输入后保存表单数据