Angular Передача данных между компонентами

Вообщем у меня есть страница на которой 2 компонента, один создаёт категории другой их редактирует, после создания категории я отправляют новую категорию в родительский компонент, где он добавляет эту категорию к общему массиву категорий и посылает этот массив в компонент который позваляет их редактировать, судя по логам все добавляется и работает без ошибок, но массив категорий компонента который их редактирует, не изменяется в реальном времени, только после перезагрузки страницы, что очень странно, нужна ваша помощь, вот код родительского компонента: html:

<div class="col s12 m6">
  <app-add-category (newCategory)="newCategoryAdd($event)"></app-add-category>
</div>
<div class="col s12 m6">
  <app-edit-category (categoryEdit)="onCategoryUpdate($event)" [categories]="categories"></app-edit-category>
</div>

ts:

export class RecordsPageComponent implements OnInit {
  categories: Category[] = [];
  isLoaded = false;

  constructor(private categoryService: CategoryService) { }

  ngOnInit(): void {
    this.categoryService.getCategories().pipe(untilDestroyed(this)).subscribe((categories: Category[]) => {
     this.categories = categories;
     this.isLoaded = true;
    });
  }

  newCategoryAdd(category: Category) {
    this.categories.push(category);
  }

  onCategoryUpdate(category: Category) {
    const idx = this.categories.findIndex(c => c._id === category._id);
    this.categories[idx] = category;
  }
}

А вот код отправки, тут только ts:

export class AddCategoryComponent implements OnInit, OnDestroy {
  form: FormGroup;

  @Output() newCategory = new EventEmitter<Category>();

  constructor(private categoryService: CategoryService) { }

  ngOnInit(): void {
    this.form = new FormGroup({
      title: new FormControl(null, [Validators.required]),
    });
  }

  onSubmit() {
    this.form.disable();
    this.categoryService.addCategory(this.form.value).pipe(untilDestroyed(this)).subscribe((category: Category) => {
      this.newCategory.emit(category);
      MaterialService.toast('Категория создана');
    }, (error) => {
      MaterialService.toast(error.error.message);
      this.form.enable();
   });
  }

  ngOnDestroy(): void {}
  }

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