我无法访问两个对象中的ID

时间:2019-10-20 11:13:58

标签: javascript html angular typescript

我对angular不熟悉,由于某些原因,我无法在位置和部门内发布id的值,

addEmployee.model.ts

export class AddEmployee {

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

AddEmployeeService

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>

1 个答案:

答案 0 :(得分:1)

由于错误来自服务AddEmployeeService,因此我认为对服务的调用未传递函数期望的参数。

调用this.restService.DefineEmployee(form.value)时,我相信value属性没有PositionDepartment属性。

您可以按照指示通过添加调试器进行测试:

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);
}