typescript - ¿Cómo puedo controlar un Dropdown de Bootstrap programáticamente (Angular)?

Tengo el siguiente Dropdown en mi Vista, y quiero abrirlo/cerrarlo desde mi clase de TypeScript. ¿Cómo podría hacerlo?

¡Gracias por cualquier ayuda!

 <div ngbDropdown class="d-inline-block">
      <button class="btn" id="cartDropdown" ngbDropdownToggle>Warenkorb<img class="warenkorbNavbar"
          src="../assets/img/shopping-cart.png" /></button>
      <div ngbDropdownMenu aria-labelledby="cartDropdown">

Respuesta #1

Puedes acceder al desplegable desde el archivo TS utilizando @ViewChild().

Agrega una variable de plantilla al ngbDropdown, por ejemplo #dropdown

<div #dropdown ngbDropdown class="d-inline-block">
  <button class="btn btn-outline-primary" id="dropdownBasic1" ngbDropdownToggle>Toggle dropdown
  </button>
  <div ngbDropdownMenu aria-labelledby="dropdownBasic1">
    <button ngbDropdownItem>Action - 1</button>
    <button ngbDropdownItem>Another Action</button>
    <button ngbDropdownItem>Something else is here</button>
  </div>
</div>

Luego usa @ViewChild() en tu archivo de typescript. Luego puedes llamar al método open en el dropdown desde dentro del typescript

@Component({
  selector: 'ngbd-dropdown-basic',
  templateUrl: './dropdown-basic.html',
})
export class NgbdDropdownBasic {
  @ViewChild(NgbDropdown, { static: true })
  public dropdown: NgbDropdown;

  public toggleDropdown(): void {
    this.dropdown.open();
  }
}

Un ejemplo funcional de Stackblitz...

https://stackblitz.com/edit/angular-7vbmva