Инъекционные услуги в Угловом декораторе - PullRequest
Новая
       11

Инъекционные услуги в Угловом декораторе

0 голосов
/ 16 января 2019

Я хочу использовать инъекционный сервис, который читается для изменений в другом компоненте, в пользовательском декораторе.

Проблема в том, что у меня нет конструктора для внедрения этого сервиса, если я создаю экземпляркомпонента, который читает его, очевидно, не читает изменения.

Как я могу внедрить его?

Я добился определенного прогресса, изменив исходный конструктор на другой, в котором есть служба, которую я хочуввести и другие параметры из оригинала.При этом у меня есть служба, и я могу получить доступ к методам в ней, но выдает ошибку при попытке вызвать ее в компоненте:

Код: 

const navbar= <T>(originalConstructor: new(...args: any[]) => T) => {
  function newConstructor(navbarService: NavbarService, ...args) {
    new originalConstructor(navbarService, args);
  }
  //Here I can take the service for operate with it, I think
  newConstructor.prototype = originalConstructor.prototype;
  return newConstructor;
}

@Component({
  selector: 'app-wizard',
  templateUrl: './wizard.component.html',
  styleUrls: ['./wizard.component.scss']
})
@navbar //Here it throws me the error belo
export class WizardComponent {

  constructor(
    private formBuilder : FormBuilder,
    private snackBar : MatSnackBar,
    private router : Router
  ) {}
}

Ошибка: 

[ts]
Unable to resolve signature of class decorator when called as an expression.
  Type '(navbarService: NavbarService, ...args: any[]) => void' is not assignable to type 'typeof WizardComponent'.
    Type '(navbarService: NavbarService, ...args: any[]) => void' provides no match for the signature 'new (formBuilder: FormBuilder, snackBar: MatSnackBar, router: Router): WizardComponent'.

Игнорируя это, я ищу другое решение, которое решает мне главную проблему: Внедрение услуг в декоратор.

Вот код декоратора, компонент, которыйвызывает его, служба и компонент ожидают изменения службы соответственно:

Декоратор и компонент, который ее вызывает: 

const navbar= <T>(originalConstructor: new(...args: any[]) => T) => {
  function newConstructor(navbarService: NavbarService, ...args) {
    new originalConstructor(navbarService, args);
  }
  //Here I can take the service for operate with it, I think
  newConstructor.prototype = originalConstructor.prototype;
  return newConstructor;
}

@Component({
  selector: 'app-wizard',
  templateUrl: './wizard.component.html',
  styleUrls: ['./wizard.component.scss']
})
@navbar //Here it throws me the error below
export class WizardComponent {

  constructor(
    private formBuilder : FormBuilder,
    private snackBar : MatSnackBar,
    private router : Router
  ) {}
}

Служба: 

@Injectable({ providedIn: 'root' })
export class NavbarService {

  service = new BehaviorSubject(null);

  constructor() { }

  openNavbar() {
    this.service.next('open');
  }

  closeNavbar() {
    this.service.next('close');
  }
}

Компонентожидание изменений службы: 

  @ViewChild('sidenav') sidenav: MatSidenav;

  constructor(
    private navbarService : NavbarService
  ) {}

  ngOnInit() {
    this.navbarService.service.subscribe(options => {
      if(options == 'open') this.sidenav.open();
      else if(options == 'close') this.sidenav.close();
    });
  }

Заранее спасибо.

Редактировать: я нашел частичное решение, но оно сосредоточено на функции декоратор, мне нужно аналогичное решение для компонента / декоратор класса.

Здесь - это решение, которое мне нужно изменить!

...