我有一个网格。网格上的每一行都有一个按钮。单击该按钮时,将切换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。