Как я могу вызвать раскрывающийся список из компонента - PullRequest
Новая
       28

Как я могу вызвать раскрывающийся список из компонента

0 голосов
/ 27 мая 2019

Я создаю угловое приложение, в котором пользователь должен иметь возможность щелкнуть правой кнопкой мыши на холсте (это охватывает большую часть страницы) и увидеть контекстное меню. Я использовал выпадающий список ngx-bootstrap для главного меню приложения и хочу использовать тот же модуль для этого контекстного меню. Демонстрация этого выпадающего меню показывает ручное переключение с помощью кнопки с 

<button type="button" class="btn btn-primary" (onclick)="dropdown.toggle(true);">Toggle</button>

Если я попробую это: Component.html 

<div id="canvas" (contextmenu)="handleRightClick($event)">
</div>

Component.ts 

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

@Component({
  selector: 'app-my',
  templateUrl: './my.component.html',
  styleUrls: ['./my.component.scss']
})
export class MyComponent {
    constructor() {
    }
    handleRightClick(e) {
        dropdown.toggle(true);
    }
}

При щелчке правой кнопкой мыши на холсте появляется ошибка: 

ReferenceError: dropdown is not defined

То, что я получил ошибку, меня не удивляет. Я нигде не объявлял эту «выпадающую» переменную. У меня вопрос: как мне получить доступ к этому выпадающему из Component.ts

1 Ответ

0 голосов
/ 30 мая 2019

Вам необходимо добавить переменную шаблона в выпадающую директиву #dropdown="bs-dropdown", и эта переменная будет работать в шаблоне, но если вам нужно управлять состоянием выпадающего списка из кода компонента, вы должны использовать @ViewChild, чтобы получить ссылку на выпадающий список, и это будет выглядеть примерно так @ViewChild('dropdown') dropdown: BsDropdownDirective;

вот пример - https://stackblitz.com/edit/angular-gnvgjn

...