我总是得到“无法读取属性'GetEmployee'的未定义”同时消耗角度服务

Question

我是角斗士的新手，通过youtube学习角度。教程适用于angular2。我正在尝试在其他类中进行服务和消费。但是当我运行我的项目时，我总是得到“无法读取未定义的属性'GetEmployee'”下面是我的代码

下面是使用该服务创建员工对象并将其返回的服务。

  import { Injectable } from '@angular/core'
  import { IEmployee } from './employee'

 @Injectable()
export class EmployeeService 
{
GetEmployee():  IEmployee[]
 {

     return [
         { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 
     5500, dateOfBirth: '01/01/2010' },
         { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 
    5500, dateOfBirth: '01/01/2010' },
         { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 
      5500, dateOfBirth: '01/01/2010' },
         { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 
       5500, dateOfBirth: '01/01/2010' },
         { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 
   5500, dateOfBirth: '01/01/2010' }
     ];
  }
 }

在下面的代码中，我正在尝试使用该服务

 import { Component } from '@angular/core'
 import { IEmployee } from './employee'
 import { EmployeeService } from './employee.service'

@Component
({
    selector: 'list-Employee',
    templateUrl: 'app/Employee/EmployeeList.component.html',
    styleUrls: ['app/Employee/EmployeeList.component.css'],
    providers: [EmployeeService]
})

export class EmployeeList {
selectedEmployeeCountRadioButton: string = 'All';
employees: IEmployee[];

private _emlployeeService: EmployeeService;

constructor(private _employeeService: EmployeeService) {
    this.employees = [
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
    ];
    alert(this._emlployeeService.GetEmployee());
    //  alert("asas")
    // this.employees=this._emlployeeService.GetEmployee();
}

getEmployee(): void {
    this.employees = [
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp01', name: 'Tom', gender: 'Male', annualSalary: 5500, dateOfBirth: '01/01/2010' },
        { code: 'emp08', name: 'Tomi', gender: 'FeMale', annualSalary: 5500, dateOfBirth: '01/01/2010' }
    ];
}
trackByEmpCode(empoyee: any): string {
    return empoyee.code;
}


onRadioButtonSelectionChanged(selectedPerson: string): void {
    this.selectedEmployeeCountRadioButton = selectedPerson;
    console.log("This " + this.selectedEmployeeCountRadioButton);

}
getTotalEmployeeCount(): number {
    return this.employees.length;
}
getTotalMaleEMployeeCount(): number {
    return this.employees.filter(e => e.gender == "Male").length;
}
getTotalFemaleEMployeeCount(): number {
    return this.employees.filter(e => e.gender == "FeMale").length;
}

}

Answer 1

在构造函数上删除private _emlployeeService: EmployeeService;。

通过做constructor(private _employeeService: EmployeeService) {你已经宣布了_employeeService财产。

Answer 2

你有两个问题。

首先是一个错字，_emlployeeService。

其次是：

在你的EmployeeList组件类中，你使用以下行声明一个新的EmployeeService：

private _emlployeeService: EmployeeService;

这是不必要的，因为Angular的依赖注入已经为您提供了EmployeeService类的实例，您可以在此处在构造函数中请求它：

constructor(private _employeeService: EmployeeService)

您声明自己的实例已声明，但未实例化，因此它是undefined。你在调用GetEmployee方法的地方，正在使用未定义的EmployeeService。