Also got this solved. The trick is waiting until document has finished loading using jQuery ducment ready function $(function() {})
.
<div id="{{$id}}">
<md-button ng-model="msg.payload">Long</md-button>
</div>
<script>
(function($scope) {
let timerTreshold = false
let timer;
$(function() {
$('#'+$scope.$id).on('touchstart mousedown', function(e) {
e.preventDefault(); //prevent default behavior
timer = setTimeout(function() {timerTreshold = true; console.log("long");}, 1000);
});
$('#'+$scope.$id).on('touchend mouseup', function(e) {
e.preventDefault(); //prevent default behavior
clearTimeout(timer);
if (!timerTreshold){
console.log("short");
}
timerTreshold = false;
});
});
})(scope);
</script>