So i have a template for Angular 2 and this template uses jQuery components that "works". Well.. When the page is resized this fire a jQuery function that re-design the sidebar adding all the items of the top navbar using the "clone()" method of jQuery. Something like this:

... code ommited ...
 $navbar = $('nav').find('.navbar-collapse').first().clone(true);
... more code ommited...

This works well, this clone all the items of the navbar on the sidebar. The only problem is a button that i have on the sidebar to logout the system. This is the code:

<a class="text-danger link-pointer" (click)="doLogout()">
    <i class="pe-7s-power"></i> Cerrar Sesión
</a>  

As you can see, i use the (click) binding that call a method of my class. The problem is: When the jQuery clone occours then is cloned, but without the binding. So the link is broken. I can't use the [routerlink] binding because i need execute some code before redirect the user to the logout page.

Any idea to do this? Thanks a lot.