Я хочу создать baseComponent для использования всех существующих компонентов для наследования этого.
Теперь я хочу лучший способ внедрить сервис в baseComponent, и у меня есть два решения для этого.
во-первых: отправьте сервис для ctor в супер компонент, как показано ниже, код, который таким образом вызывает изменение всех дочерних компонентов в теле и методе. но этот способ работает правильно
IService.ts
export interface IService {}
ICrudService.ts
export interface ICrudService extends IService {
getById(id: any): Promise<any>;
getList(): Promise<any>;
getListByParam(fields?: Array<string>,rel?: Array<ItemRelValue>,statePaging?: State,filterSingle?: Array<any>,extraParams?: any,groups?: Array<any>): Promise<any>;
update(item: any): Promise<any>;
remove(id: any): Promise<any>;
add(item: any): Promise<any>;
}
BaseComponent.ts
export abstract class BaseComponent{
public gridData: any = { };
public state: State = { };
protected param: Array<string> = [];
protected rel: Array<ItemRelValue> = [];
protected filter: Array<any> = [];
protected groups: Array<Group> = [];
protected aggregate: Array<Aggregate> = [];
constructor(public title: Title,public router: Router,public toaster?: ToasterService,public service:IService) { }
protected getDataByParam() {
this.service
.getListByParam(this.param,this.rel,this.state,this.filter,null,this.groups)
.then(response => {
if (response.total) {
this.gridData.total = Number(response.total);
}
response.data.forEach((item, index) => {
this.rowReview(item);
item.rowNumber = rowNumber++;
this.gridData.data.push(item);
});
})
.catch(error => {
this.toaster.popAsync("error", "خطا", error.message);
});
}
protected abstract rowReview(item?);
// Todo: chane top review response
public exportToExcel = (): Promise<any> => {
return this.service
.getListByParam(this.param,this.rel,this.state,this.filter,null,this.groups )
.then(response => {
response.data.forEach((item, index) => {
this.rowReview(item);
item.rowNumber = index + 1;
});
return Promise.resolve(response);
})
.catch(error => {
this.toaster.popAsync("error", "خطا", error.message);
return Promise.reject({});
});
};
}
и один из унаследованных компонентов
export class EducationalPostComponent extends BaseComponent {
constructor(
public title: Title,
public router: Router,
public toaster: ToasterService,
private fb: FormBuilder,
private postsService: PostsService
) {
super(title, router, toaster,postsService);
}
}
второй способ: я хочу использовать универсальный режим или лучший способ уменьшить изменения в нашем проекте, отправить сервис из универсального режима типа (я не доволен этой моделью), как показано ниже code
класс экспорта EducationalPostComponent расширяет Base2 {
// endregion
BaseComponent.ts
export abstract class BaseComponent<T>{
...
public service :any={} as T;
constructor(
public title: Title,
public router: Router,
public toaster?: ToasterService,
) {
}
...
* *} Тысяча двадцать-один
и один из унаследованных компонентов
export class EducationalPostComponent extends Base2<EducationalPostService> {
constructor(
public title: Title,
public router: Router,
public toaster: ToasterService,
private fb: FormBuilder
) {
super(title, router, toaster);
}
}
но этот способ не работает и выдает ошибку во время выполнения.
Я в замешательстве.
лучший способ динамически внедрить сервис и как работать в parentComponent.