代码之家  ›  专栏  ›  技术社区  ›  jonsnow69

使用angular将表单中的所有数据发送到api

  •  0
  • jonsnow69  · 技术社区  · 3 年前

    我是新来的,所以如果我问了一些小问题或错误的问题,请不要误会我

    <form >
      <label for="fname">First name:</label>
      <input type="text" id="fname" name="fname"><br><br>
      <label for="lname">Last name:</label>
      <input type="text" id="lname" name="lname"><br><br>
    </form>
    <button>submit<button>

    我想通过angular将这些值发送给api

    1 回复  |  直到 3 年前
        1
  •  1
  •   Rohith_29    3 年前

    如果你使用angular,你应该知道: https://material.angular.io/guides

    你有棱角的html

    <form [formgroup] = formname>
      <label for="fname">First name:</label>
      <input formControlname=name type="text" id="fname" name="fname"><br><br>
      <label for="lname">Last name:</label>
      <input formControlname=name type="text" id="lname" name="lname"><br><br>
    </form>
    <button (click)="submitdata()">submit<button>
    

    你的TS文件

    import{HttpClient}............
    import{FormBuilder, FormGroup, Validators, FormControl}........
    const(private formbuilder:FormBuilder, private http:HttpClient)
    formname!:formgroup;
    ngOnInit{
    this.formname = this.formbuilder.group({
    name : ['',validators.required];
    lname : ['', validators.required];
    })
    }
    submitdata(){
    this.http.post('your_url', this.formname.value)
    }