英文:
angular post request [object%20Object] error
问题
我想更新主页上的当前用户，使用以下的POST请求。URL: "http:...../user"，而POST所需的URL应该是: "http:......./user/id"，但是URL被发送为 http:/...../user/[object%20Object]，我收到了一个错误。我该如何修复这个问题？
Service;
updateUser(id: number): Observable<User> {
return this.http.put<User>(`${this.url}/${id}`, id)
}
User.ts;
export interface User {
id: number
firstName: string
lastName: string
username: string
mail: string
password: string
}
home.component;
updateUser(id: number) {
this.router.navigate(['update', id]);
}
update.component;
export class UpdateUserComponent implements OnInit {
user?: User
data: any
constructor(private service: AppService, private route: ActivatedRoute, private router: Router) { }
ngOnInit(): void {
}
form = new FormGroup({
firstName: new FormControl('', [Validators.required]),
lastName: new FormControl('', [Validators.required]),
username: new FormControl('', [Validators.required]),
mail: new FormControl('', [Validators.required]),
password: new FormControl('', [Validators.required]),
})
submit() {
this.data = this.form.value
console.log(this.data)
this.service.updateUser(this.data).subscribe(data => {
console.log(data)
})
this.router.navigate(['/']);
}
}
注意：上述代码中可能存在一些问题，你可能需要根据具体情况进行调整和修复。
英文:
I want to update the current user on the home page with the following post request. url: "http:...../user" and the url required for the post should be: "http:......./user/id" but the url is sent as http:/...../user/[object%20Object] and I get an error. how should I go about fixing this?
Service;
updateUser(id: number): Observable<User> {
return this.http.put<User>(`${this.url}/${id}`, id)
}
User.ts;
export interface User {
id: number
firstName: string
lastName: string
username: string
mail: string
password: string
}
home.component;
updateUser(id: number) {
this.router.navigate(['update', id]);
}
update.component;
export class UpdateUserComponent implements OnInit {
user?: User
data: any
constructor(private service: AppService, private route:
ActivatedRoute, private router: Router) { }
ngOnInit(): void {
}
form = new FormGroup({
firstName: new FormControl('', [Validators.required]),
lastName: new FormControl('', [Validators.required]),
username: new FormControl('', [Validators.required]),
mail: new FormControl('', [Validators.required]),
password: new FormControl('', [Validators.required]),
})
submit() {
this.data = this.form.value
console.log(this.data)
this.service.updateUser(this.data).subscribe(data => {
console.log(data)
})
this.router.navigate(['/']);
}
}
答案1
得分: 2
你在服务中的updateUser方法中只传递了一个参数，而这个参数不是id，而是整个表单数值对象，所以才显示[Object%20Object]。
请在你的服务代码中更新，传递id和data两个参数：
updateUser(id: number, data: User): Observable<User> {
return this.http.put<User>(`${this.url}/${id}`, data)
}
在update.component.ts文件中修改提交方法，从路由参数中获取id并传递给updateUser服务方法：
submit() {
this.data = this.form.value;
const id = this.route.snapshot.params['id'];
this.service.updateUser(id, this.data).subscribe(data => {
console.log(data)
})
}
希望这能解决你的问题。
英文:
You are passing only one parameter to your udateUser method in the service and that is not id but the whole form value object thats why its showing [Object%20Object].
update the code inside your service and pass id and data two parameters
updateUser(id: number, data: User): Observable<User> {
return this.http.put<User>(`${this.url}/${id}`, data)
}
modify submit method inside update.component.ts file to get id from route param and pass to updateUser service method.
submit() {
this.data = this.form.value;
const id = this.route.snapshot.params['id'];
this.service.updateUser(id, this.data).subscribe(data => {
console.log(data)
})
Hope this works
答案2
得分: 0
你将整个表单发送到了只期望一个ID的服务中。你需要重写服务并发送ID和表单值！
英文:
You're sending the entire form into the service that is expecting just an id.
You need to rewrite the service and send id and form value!
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论