如何从表单访问填充的数据？

Question

数据从mongodb的日期数据库中以表格形式填充。我无法将填充的数据保存在变量中。我得到的结果是“未定义”。You can see in the console(image) that all the fields that i am getting is undefined

**文件名：HTML：-

<form (ngSubmit)="userInfo(f)" method="POST" #f="ngForm">

  <label for="fname">Token Number</label>
  <input type="number" [(ngModel)]="token" id="token" name="token" value="{{leadDetail?.data.token}}" placeholder="">
  <br>
  <br>

  <label for="name">Name</label>
  <input type="text" ngModel name="name" #name="ngModel" value="{{leadDetail?.data.user.name}}" placeholder="">

  <label for="num">Phone Number</label>
  <input type="number" ngModel name="num" #num="ngModel" value="{{leadDetail?.data.user.phoneNumber}}" placeholder="">
  <br>
  <br>

  <label for="gender">Gender</label>
  <input type="text" ngModel name="gender" #gender="ngModel" value="{{leadDetail?.data.gender}}" placeholder="">

  <label for="stage">Stage</label>
  <input type="text" ngModel name="stage" #stage="ngModel" value="{{leadDetail?.data.stage}}" placeholder="">

  <label for="service">Service</label>
  <input type="text" ngModel name="service" #service="ngModel" value="{{leadDetail?.data.service}}" placeholder="">

  <label for="person">Service Person</label>
  <input type="text" ngModel name="person" #person="ngModel" placeholder="">



  <input type="submit" value="Submit">

</form>

**文件名：-TS文件：-

userInfo(form:any) {
     const info = {
       token : form.value.token,
       name : form.value.name,
       phoneNumber : form.value.phoneNumber,
       gender : form.value.gender,
       stage : form.value.stage,
       service : form.value.service,
       servicePerson: form.value.person
     }
     console.log(info)