Исправлен элемент «прыжки» на свитке

Question

Я пытаюсь создать фиксированный элемент при прокрутке.Я использую cdkScrollable для создания события прокрутки и наблюдаю его в своем фиксированном компоненте.Класс фиксированный или абсолютный устанавливается только если я использую changeDetector, без моего представления не обновляется.Другая проблема заключается в фиксированном элементе «прыжков» при прокрутке, переход не плавный.Есть идеи как это исправить?Заранее спасибо:)

ngOnInit() {
    this.dispatcherService.scrolled().pipe(
      map((scroll: CdkScrollable) => scroll.measureScrollOffset('top')),
      map((offset: number) => offset >= this.elementPosition),
      startWith(false),
      distinctUntilChanged()
    ).subscribe(fixed => {
      this.fixed = fixed;
      this.cdr.detectChanges()
    });
  }

 ngAfterViewInit() {
    this.elementPosition = this.fixedComponent.nativeElement.getBoundingClientRect().top;
  }

<div class="fixed-box" [ngClass]="{'fixed': fixed, 'absolute': !fixed}" #fixedComponent>
  <ng-content></ng-content>
</div> 

<mat-sidenav-content cdkScrollable>
    ...
    <ng-content></ng-content>
  </mat-sidenav-content>