Estou usando um template que comprei feito em Angular, porém não está tudo em Angular tem muita coisa em jQuery.
Eu estou usando o Datatable do jQuery (pois já é o nativo do template, está com o css todo pronto e inclusive já está buscando os dados e paginando), porém eu preciso de algumas ações em alguns elementos que preciso (quero) que seja processado pelo angular. Como marcar um checkbox por exemplo.
Eu estou usando o fnRowCallback do Datatable para tratar o html. No exemplo abaixo eu gostaria de ao mudar o estado checkbox (html gerado pelo plugin em jQuery) os dados serem enviados para o método changePropertyEnabled (método do componente do Angular)
...,
fnRowCallback: function (nRow, aData, iDisplayIndex) {
const mDataEnabled = '<label class="ui-switch switch-icon">' +
'<input type="checkbox" (change)="changePropertyEnabled(1, false)">' +
'<span></span>' +
'</label>';
const mDataRemoveIcon = '<a class="text-muted font-16" href="javascript:;"><i class="ti-trash"></i></a>';
//
$('td:eq(0)', nRow).html(mDataEnabled);
$('td:eq(6)', nRow).html(mDataRemoveIcon);
return nRow;
},
...
changePropertyEnabled(id: number, enabled: boolean) {
alert('Hello World');
}
(change)="changePropertyEnabled(1, false)"
está correta. E existe algum motivo específico de você estar gerando esse HTML dinamicamente pelafunction
? Você poderia criar ele normalmente e utilizar um*NgIf
na chamada da mesma.change
mas isso é uma suposição. Talvez gerar ele sem ser estático seja uma boa tentativa.