Как использовать множественное наследование с angular компонентами - PullRequest
Новая
       36

Как использовать множественное наследование с angular компонентами

1 голос
/ 04 февраля 2020

У меня есть два базовых класса, структура которых выглядит примерно так, как показано ниже: 

 export class EmployeeSearch(){

    constructor(
        public employeeService: EmployeeService,
        public mobileFormatPipe: MobileFormatPipe
    )

    searchEmployeeById();

    searchEmployeeByName();
}

export class EmployerSearch(){

    constructor(
        public employerService: EmployerService,
        public mobileFormatPipe: MobileFormatPipe,
        public employerNamePipe: EmployerNamePipe
    )

    getAllEmployers(){

    }

    getLocalEmployers(){

    }
}

У меня есть класс компонентов, в котором я хочу использовать два класса выше. 

export class addNewEmployeeComponent(){

    constructor(){

    }
}

Я попытался использовать решение applyMixins, чтобы использовать интерфейс для расширения нескольких классов. но я не знаю, как определить super () для базового класса при расширении двух классов, и столкнулся с ошибкой при попытке использовать класс mixin AddNewEmployee в компоненте. 

import { EmployeeSearch } from './employee-search';
import { EmployerSearch } from './employer-search';

export class  AddNewEmployee{

}
export interface AddNewEmployee extends EmployeeSearch, EmployerSearch{

}

function applyMixins(derivedCtor: any, baseCtors: any[]) {
    baseCtors.forEach(baseCtor => {
      Object.getOwnPropertyNames(baseCtor.prototype).forEach(name => {
        Object.defineProperty(derivedCtor.prototype, name, Object.getOwnPropertyDescriptor(baseCtor.prototype, name));
      });
    });
  }

applyMixins(SearchPatient, [PatientSearch, DepartmentDoctorSelect]);

Я создал миксин, используя приведенный выше код, но не знаю, как я могу использовать класс AddNewEmployee в AddNewEmployeeComponent.

Мой пример использования состоит в том, что у меня есть два класса, которые мне нужно использовать в моем компоненте, но множественное наследование невозможно. Пожалуйста, предложите другое решение для моего варианта использования, если таковое имеется.

Я ответил на этот вопрос , но не смог понять принятый ответ.

Спасибо!

1 Ответ

0 голосов
/ 04 февраля 2020

Вам не нужно наследовать от этих классов, чтобы использовать их, вы можете просто объявить EmployeeSearch и EmployerSearch как сервисы, например ::

@Injectable({
  providedIn: 'root',
})
// note that you don't need `()` in this line
export class EmployeeSearch {

    constructor(
        public employeeService: EmployeeService,
        public mobileFormatPipe: MobileFormatPipe
    )

    searchEmployeeById();

    searchEmployeeByName();
}

А затем просто вставить их в свой сервис или компонент и использовать их. 

import { EmployeeSearch } from './employee-search';
import { EmployerSearch } from './employer-search';

// if you need them in another service
@Injectable({
  providedIn: 'root',
})
export class EmployeeService {

  constructor(
      private employeeSearch: EmployeeSearch,
      private employerSearch: EmployerSearch
  ) { }

  fancyBusinessMethod(employeeID: number) {
      const employee = this.employeeSearch.searchEmployeeById(employeeID);
      // ...
  }
}

// if you need them in a component
@Component({
  selector: 'app-emp',
  templateUrl: `
<div>
  <p *ngFor="let emp of employees">{{ emp.name }}</p>
</div>
`,
  styleUrls: []
})
export class EmployeeComponent {

  public employees: Employee[] = [];

  constructor(
      private employeeSearch: EmployeeSearch,
      private employerSearch: EmployerSearch
  ) { }

  onEmpSearch(id: number) {
    this.employees = this.employeeSearch.searchEmployeeById(employeeID);
}
...