如何使用 angular-material 在下拉列表中添加三角形

Question

我正在尝试使用 md-menu-bar 和 md-menu 创建 drop-down 你可以在快照中看到

使用代码

<md-menu-bar>
   <md-menu>
     <md-button aria-label="Open phone interactions menu" class="md-icon-button" ng-click="$mdOpenMenu($event)">
                    <img ng-src="https://media.licdn.com/mpr/mpr/p/5/005/098/12f/223c996.jpg" class="uilr-avatar">
                </md-button>
                <md-menu-content width="4">
                    <md-menu-item>
                        <md-button ng-click="ctrl.redial($event)">
                            <md-icon md-svg-icon="call:dialpad" md-menu-align-target></md-icon>
                            Redial
                        </md-button>
                    </md-menu-item>
                    <md-menu-item>
                        <md-button disabled="disabled" ng-click="ctrl.checkVoicemail()">
                            <md-icon md-svg-icon="call:voicemail"></md-icon>
                            Check voicemail
                        </md-button>
                    </md-menu-item>
                    <md-menu-divider></md-menu-divider>
                    <md-menu-item>
                        <md-button ng-click="ctrl.toggleNotifications()">
                            <md-icon md-svg-icon="social:notifications-{{ctrl.notificationsEnabled ? 'off' : 'on'}}"></md-icon>
                            {{ctrl.notificationsEnabled ? 'Disable' : 'Enable' }} notifications
                        </md-button>
                    </md-menu-item>
                </md-menu-content>
            </md-menu>
        </md-menu-bar>

但我希望这个下拉菜单顶部有一个三角形请检查从 inbox.google.com 拍摄的快照

请告诉我怎样才能做到这一点。提前致谢

Answer 1

请检查以下内容fiddle 这就是你想要的吗？

[https://jsfiddle.net/suunyz3e/252/]

如何使用 angular-material 在下拉列表中添加三角形

How to add triangle in drop down using angular-material

css

drop-down-menu

angular-material