Как внедрить или отправить сервис из унаследованного компонента в базовый компонент - PullRequest
1 голос
/ 20 апреля 2019

Я хочу создать 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.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...