angular 9 материал bootstrap сиденав не прячется

Question

Я новичок в angular 9
с использованием bootstrap и md bootstrap template
проблема с sidenav при нажатии на выдвижную кнопку, появляется sidenav
, но когда я нажимаю на оверлей скрывается
нет ошибки на консоли

sidenavComponent.ts

import { Component, OnInit } from '@angular/core';

declare var $: any;//**********************notice this for $(document).ready()
@Component({
  selector: 'app-sidenav',
  templateUrl: './sidenav.component.html',
  styleUrls: ['./sidenav.component.css']
})
export class SidenavComponent implements OnInit {

  constructor() { }

  ngAfterViewInit(){ //**********************notice this for sidenav
    $(function(){
      $(".button-collapse").sideNav();
    });
  }

  ngOnInit(): void {

  }

}

На самом деле у меня есть старый php / jquery веб-сайт, который нужно скопировать тот же шаблон, там в PHP работает нормально с такой же jquery строкой $(".button-collapse").sideNav();