如何将angular 2前端表单数据传递给lumen api BackEnd

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

@Component({
  selector: 'app-form',
  template: `
    <form (submit)="submitForm()">
      <input type="text" name="name" [(ngModel)]="formData.name" required>
      <input type="email" name="email" [(ngModel)]="formData.email" required>
      <button type="submit">Submit</button>
    </form>
  `
})
export class FormComponent {
  formData = {
    name: '',
    email: ''
  };

  constructor(private http: HttpClient) {}

  submitForm() {
    this.http.post('http://your-lumen-api.com/submit-form', this.formData)
      .subscribe(response => {
        console.log(response);
      });
  }
}

// routes/web.php
$router->post('/submit-form', 'FormController@submitForm');

// app/Http/Controllers/FormController.php
namespace App\Http\Controllers;

use Illuminate\Http\Request;

class FormController extends Controller
{
    public function submitForm(Request $request)
    {
        $validatedData = $request->validate([
            'name' => 'required',
            'email' => 'required|email',
        ]);

        // 处理表单数据，执行其他业务逻辑

        return response()->json(['message' => 'Form submitted successfully']);
    }
}