Атрибут названия мат-радио-кнопки для простой формы POST

Question

Я работаю над простой формой, конвертирующей ее из начальной загрузки в Material.

Хотя я работаю с Angular 6, форма отправляется в старом стиле при отправке (без использования угловых форм)

<form method="post" action="http://api.example.com/submit" id="user_form">

   <mat-form-field>
      <input matInput placeholder="name" name="username">
   </mat-form-field>


   <mat-radio-group required>
      <mat-radio-button name="company" value="company1">company 1</mat-radio-button>
      <mat-radio-button name="company" value="company2">company 2</mat-radio-button>
   </mat-radio-group>

   <button type="submit">submit</button>

</form>

Для простоты я бы хотел оставить это так, и я не хочу использовать какой-либо javascript для отправки этой формы (без формы на основе шаблона ИЛИ реактивной формы).

Ввод отлично работает с добавлением атрибута имени в Imput, и когда я помещаю POST-форму (нажмите на кнопку отправки), она отправляется на сервер, как и ожидалось.

как для mat-radio, эти данные не 'Отправлено на сервер в данных поста.Я предполагаю, что первый - это собственный ввод, где mat-radio-button является компонентом.

Есть ли способ заставить это работать?(опять же, без обработки формы POST на стороне TS)

Answer 1

попробуйте что-то вроде этого

в html

<mat-radio-group formControlName="gender">
      <mat-label>Gender:</mat-label>&nbsp;
      <mat-radio-button color="primary" value="male">Male</mat-radio-button
      >&nbsp;
      <mat-radio-button color="primary" value="female">Female</mat-radio-button>
    </mat-radio-group>

в ts

this.signupForm = new FormGroup({
      gender: new FormControl("", Validators.required),

    });