如何解决如何在外部单击时隐藏行弹出窗口
我有一个网格。网格上的每一行都有一个按钮。单击该按钮时,将切换div外观。我正在应用ng-if来显示div。
我所做的
查看
cellTemplate:
'<div style="position:absolute;">' +
'<span ng-class="{ \'contact-grid-note\': row.entity.notes != null,\'contact-grid-note-disabled\': row.entity.notes == null }" ng-click="grid.appScope.toggleNote(row.entity)">' +
'</span>' +
'<div class="contact-note-container" ng-if="row.entity.showNote" id="info">' +
'<div class="contact-note-header">' +
'<div class="contact-note-time">22/07/2020 18:23</div>' +
'<div class="contact-note-where">Test</div>' +
'</div>' +
'<div class="contact-note-content">{{row.entity.notes}}</div>' +
'</div>' +
'</div>',
JavaScript
vm.toggledContact = null
vm.toggleNote = function (contact) {
if (contact.notes) {
if (vm.toggledContact) {
vm.toggledContact.showNote = false;
vm.toggledContact = null;
}
vm.toggledContact = contact;
vm.toggledContact.showNote = true;
vm.toggledContact.isInitial = true;
}
}
$(document).click(function (e) {
// check that your clicked
// element has no id=info
// and is not child of info
if (e.target.id != 'info' && !$('#info').find(e.target).length && vm.toggledContact && vm.toggledContact.showNote && !vm.toggledContact.isInitial) {
vm.toggledContact.showNote = false;
vm.toggledContact = null;
$scope.$apply();
}
else if (vm.toggledContact && vm.toggledContact.isInitial) {
vm.toggledContact.isInitial = false;
}
});
这段代码可以工作,但是我觉得它不是很干净。我想知道是否有更好的方法可以消除来自外部点击的div。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。