Этого можно достичь с помощью MatDialog, но это сопряжено с некоторыми неудачами (и, вероятно, это связано с созданием собственного всплывающего окна или использованием одного из существующих).
Прежде всего, вам нужно будет использовать заданную высоту или ширину (высота, если всплывающее окно должно отображаться слева/справа от кнопки, ширина, если сверху/снизу). В качестве альтернативы вы можете поиграть с проверкой размера диалогового окна после его отображения и соответствующим образом обновить позиционирование - это должно быть выполнимо, но не проверялось.
Во-вторых, может быть сложно добавить стрелку из-за уже существующего стиля материала (опять же, не пробовал).
Что вы хотите сделать, так это получить ограничивающий прямоугольник кнопки и использовать эти значения для установки свойства position на MatDialogConfig.
Базовая реализация (справа от кнопки) здесь. Для другого позиционирования соответствующим образом скорректируйте расчеты (должно быть довольно логично).
Опять же, я советую заглянуть в CDK Overlay в Material и создать собственный компонент, поскольку он, вероятно, сэкономить ваше время в долгосрочной перспективе.
person
TotallyNewb
schedule
01.07.2020