How to close a Bootstrap modal after routerlink redirection with Angular 6

I am developing my first Angular app. I have a Bootstrap modal with a button which redirects to another section of the app.

<button type="button" class="btn btn-info btn-lg" routerLink="/contactar">Contáctenos</button>

Problem is, when I get redirected to that section, the modal is somehow still enabled and the whole section is covered with the typical grey transparency behind the modals, and I am not allowed to push any button or do something on this "contactar" section.

I tried to close the modal using jQuery and modal() function, with this method on my component.ts, on the (click) event of the button.

closeModal()
{
    let mod=$(".modal")[0];
    mod.modal('hide');
} 

Like this:

<button type="button" class="btn btn-info btn-lg" (click)="closeModal()" routerLink="/contactar">Contáctenos</button>

But it throws the error "Property modal does not exist on type HTML element".

I also tried to do:

npm install -D @types/bootstrap

Like suggested here

But it doesn't work.

A solution I found is using a link with href attribute instead of that button. That way the page is loaded again, and then, no modal is activated when I get redirected to the section:

<a type="button" class="btn btn-info btn-lg" href="/contactar">Contáctenos</a>

But I don´t like it since it breaks the asynchonous advantages of Angular, and I would like to find a way to close that modal before I get redirected though the routerLink directive.

Thank you in advance.