javascript - 我无法访问两个对象中的 id

Question

我是 Angular 的新手，我无法在 Position 和 Department 中发布 id 的值，出于某种原因，它无法访问 id

addEmployee.model.ts

export class AddEmployee {

  Position: {
    id: string;
  };
  Department: {
    id: string;
  };
}

添加员工服务

DefineEmployee(addEmployee: AddEmployee) {
  const body: AddEmployee = {

    Position: {
      id: addEmployee.Position.id
    },

    Department: {
      id: addEmployee.Department.id
    }
  }
  return this.http.post('url', body);
}

AddEmployee.component.ts

onSubmit(form: NgForm) {

  return this.restService.DefineEmployee(form.value).subscribe((res: any) => {
    this.resetForm(form);
    console.log(res);
  }, error => {
    this.resetForm(form);
  })
}

addEmployee.component.html

<div class="form-group">

  //AddEmployee.Position.id comes up with undefined element 'id'

  <select [(ngModel)]="AddEmployee.Position.id" name="Position" Position="ngModel" class="form- 
             control customized-dropdown">
    <option [value]="item.id" *ngFor="let item of positions">{{item.name_FL}}</option>
  </select>
</div>

Answer 1

由于错误来自服务 AddEmployeeService，我相信对该服务的调用没有传递您的函数期望的参数。

当您调用 this.restService.DefineEmployee(form.value) 时，我相信 value 属性没有 Position 或 部门属性。

您可以按照指示添加调试器来测试它:

DefineEmployee(addEmployee: AddEmployee) {
  console.log(addEmployee);
  debugger;
  const body: AddEmployee = {

    Position: {
      id: addEmployee.Position.id
    },
    ...

这应该可以帮助您修复该功能

更新

Op 将 addEmployee 变量的内容发布为:

{
 "Position":"c8a06de6-58e1-439a6fc-08d7553139ac",
 "Department":"552ccb91-02f8-476b-adbc-08d7553136bf"
}

职位和部门的 ID 似乎在“addEmployee”变量中没有“id”属性；

所以要解决这个问题，只需从服务中的 addEmployee 中删除“ids”

DefineEmployee(addEmployee: AddEmployee) {
  const body: AddEmployee = {

    Position: {
      id: addEmployee.Position // <<< here
    },

    Department: {
      id: addEmployee.Department  // <<< here
    }
  }
  return this.http.post('url', body);
}