我希望在单击多个不同的按钮时出现相同的菜单。
如何将原始点击事件传递给新创建的触发事件?
这就是我今天所做的:
this.openMenuFromOther = function(event) {
$timeout(function() {
var ele = document.getElementById('userMenu');
angular.element(ele).triggerHandler('click');
}, 0);
}
在演示中,您可以看到它创建了一个与原始单击事件不对应的新事件,并且菜单在主按钮上打开,而不是在单击的按钮上打开。
最佳答案
简单的答案是:你不能。
Angular 无意让您选择重用它。你可以看到这是他们的source code 。 $scope.$mdMenu = {}
返回不同的范围,因此阻止您更改任何变量。即使是“hacky”的方法也很难找到。
您必须更改 menuContainer
和triggerElement
到你的新触发器,然后最后将其改回来。但正如前面提到的,这样做真的很难看。
最简洁的解决方案是制作模板。
模板包含您要重复使用的菜单。 (这应该在 <body ng-app="MyApp">
内)
<script type="text/ng-template" id="menu">
<md-menu md-offset="0 60">
...
</md-menu>
</script>
然后你制定一个指令,例如
.directive('mdMenuButton', function($compile, $templateCache) {
return {
restrict: 'M',
replace: 'true',
template: $templateCache.get('menu')
// as of now "templateUrl" doesn't work in this case
}
})
您现在可以像这样多次重复使用此代码
<!--directive: md-menu-button -->
<br/> different stuff not related
<br/> different stuff not related
<!--directive: md-menu-button -->
<br/> different stuff not related
关于javascript - 以 Angular 方式将事件传递给triggerHandler,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43488495/