Executing angularjs function within jquery

Question

Executing angularjs function within jquery

Any ideas how when the user selects the jquery select function, the code can execute the selectResults() (angular function) and pass in the user selected value?

minLength: 2,
delay: 500,
select: function (event, ui) {
    $('#fwSearch').val(ui.item.selectedValue);

    debugger;
    //navigate to the FirewallDetail page.
    selectResults($('#selectedUnit').val(ui.item.selectedValue));
}

jquery
angularjs

Answer 1

Here is how you can do it by using directive. http://plnkr.co/edit/ZFj4rz

In this example, it uses source and onselect attributes for handling autocomplete source and select event.

app.directive('autocomplete', function() {
  return { 
    restrict: 'A',
    scope: {
      source: '=',
      onselect: '='
    },
    link: function( scope, elem, attrs ) {
      $(elem).autocomplete({
        source: scope.source,
        delay: 500,
        minLength: 2,
        select: function( event, ui ) {
          scope.onselect( ui.item.value );
        }
      });
     }
  };
});