typescript - როგორ შემიძლია Bootstrap Dropdown-ის პროგრამულად კონტროლი (Angular)
ჩემს ხედვაში მაქვს შემდეგი Dropdown და მინდა ვ გახსნა/დაკეტო ის ჩემი TypeScript კლასიდან. როგორ უნდა გავაკეთო ეს?
მადლობა ნებისმიერი დახმარებისთვის!
<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">
პასუხი #1
თქვენ შეგიძლიათ მიუწვდეთ dropdown-თან TS ფაილიდან @ViewChild()-ის გამოყენებით.
დაამატეთ ტემპლატის ცვლადი ngbDropdown-ისთვის, მაგალითად #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>
შემდეგ გამოიყენეთ @ViewChild() თქვენი TypeScript ფაილში. ამის შემდეგ შეგიძლიათ დაბმულ დრაფნისზე open მეთოდი გამოიძახოთ 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();
}
}
სამუშაო Stackblitz მაგალითი...
https://stackblitz.com/edit/angular-7vbmva
