Как обновить значение, используя формы и сервисы на angular?

Question

У меня есть проблема с обновлением значения с использованием реактивных форм и сервисов?Я нашел проблему.его в компоненте -> updateData () -> что аргументы ..

пожалуйста, помогите мне решить эту проблему .. я не знаю, какой аргумент мне нужно передать?Я нашел проблему.его в компоненте -> updateData () -> что аргументы ..

Пожалуйста, помогите мне решить эту проблему .. Я не знаю, какой аргумент мне нужно передать?

HTML:

 <form [formGroup]="group">
        <div> &nbsp;  &nbsp; Id<input formControlName="Id"/></div>
        <br> 
      <div> &nbsp;  &nbsp; Name<input formControlName="Name"/></div>
      <br> 
     <div> &nbsp;  &nbsp; Title<input formControlName="Title"/></div>
      <br>
      <div> &nbsp;  &nbsp; Author<input formControlName="Author"/></div>
      <br>
    </form>
    &nbsp; &nbsp; &nbsp; &nbsp;
    <button (click)="updateData()">Update</button> &nbsp;
    <div>
    <button (click)="listData()">List</button>
    {{list | json}}
    </div>

component.ts

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { HttpClient } from '@angular/common/http';
import { ControlService } from '../control.service';
import { NgForOf } from '@angular/common';

@Component({
  selector: 'app-forms',
  templateUrl: './forms.component.html',
  styleUrls: ['./forms.component.css']
})
export class FormsComponent implements OnInit {
group:FormGroup;
list;
list1;
  constructor(private fb:FormBuilder, private service:ControlService) {
    this.group=this.fb.group({
      Id:[''],
      Name:[''],
      Title:[''],
      Author:[''],
    })
   }

ngOnInit() {

  }
listData(){
  this.service.userData().subscribe(res=>{
    console.log("list data",res);
    this.list=res;
  },error=>{
    console.log("error1",error);
  })
}
updateData(){
this.service.updateUserData({group.Name:this.list}).subscribe(res=>{
  console.log('update data',res);
  this.list1=res;
},error=>{
  console.log("error2",error);
})
}


}

service

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class ControlService {

  constructor(private http:HttpClient) {}
userData(){
 return this.http.get('http://localhost:5000/user');
}
updateUserData(value){
  return this.http.put('http://localhost:5000/user/2',value);
 }

}

Answer 1

Если вы спрашиваете, как получить данные из формы, используйте это:

this.service.updateUserData(this.group.value).subscribe(...);

Свойство value группы формы предоставляет все значения из элементов управления формы в форме.