Мой класс javascript загружается перед визуализацией моей страницы. Так что querySelectorAll
возврат 0
.
Как загрузить мой класс после рендера Angular?
page.ejs
<body ng-app="GestiawebApp">
<script src="myclass.js"></script>
<!-- ng repeat <a href="#" data-dialog="true">....-->
</body>
myclass.js
+(function($) {
'use strict';
document.addEventListener('DOMContentLoaded', function() {
var buttons = document.querySelectorAll('[data-dialog="true"]');
Array.prototype.forEach.call(buttons, function(btn) {
btn.addEventListener('click', function(e) {
var link = e.currentTarget,
url = link.getAttribute('href'),
messageText = link.getAttribute('data-dialog-message') || 'Êtes-vous sûr ?',
btnClass = (link.getAttribute('data-dialog-danger')) ? 'is-danger' : 'is-main-color',
actionTitle = link.getAttribute('data-dialog-action-title') || 'Valider',
dialogNode, lightNode;
lightNode = document.createElement('div');
lightNode.classList.add('is-dark-light');
document.body.appendChild(lightNode);
$(lightNode).fadeIn();
dialogNode = document.createElement('div');
dialogNode.classList.add('dialog');
document.body.appendChild(dialogNode);
dialogNode.innerHTML = '<p>' + messageText + '</p><div class="space-20"></div><div class="flexline is-full has-margin no-mobile"><a class="btn" type="reset">Annuler</a><a data-loader="true" class="btn ' + btnClass + '" type="submit">' + actionTitle + '</a></div>';
$(dialogNode).fadeIn();
e.preventDefault();
dialogNode.querySelector('[type="submit"]').addEventListener('click', function() {
window.location.href = url;
});
dialogNode.querySelector('[type="reset"]').addEventListener('click', function() {
$(lightNode).fadeOut( function() {
lightNode.remove();
$(dialogNode).fadeOut( function() {
dialogNode.remove();
});
});
});
});
});
});
})(jQuery);