CODEWITHSUNDEEP
javascriptjqueryangularjsangularjs-ng-repeat
Diamonds
Diamonds

Reputation: 157

Updating a ng-repeat filter after programmatically updating a text input

I am using jQuery auto-complete to start filling in values for users who type into a text input.

<input type="text" ng-model="tags" name="tags" id="tags" value="" />

Later on my ng-repeat is filtering things based on that text

<div ng-repeat="ability in abilities | tagsFilter:tags">
 {{ ability }}
</div>

Inside jQuery auto-complete, there is a callback function for when a user selects an item from the auto-complete drop down.

    select: function( event, ui ) {
      var terms = split( this.value );
      // remove the current input
      terms.pop();
      // add the selected item
      terms.push( ui.item.value );
      // add placeholder to get the comma-and-space at the end
      terms.push( "" );
      this.value = terms.join( ", " );

      // I Want to tell angularJS to update

      return false;
    }

How would I tell my ng-repeat to update?

I tried looking into $scope.apply() but $scope is not in scope for the jQuery callback.

Upvotes: 0

Views: 784

Answers (1)

jshanley
jshanley

Reputation: 9128

You should be able to access the scope from there.

Try this:

var scope = angular.element($('#tags')).scope();

scope.$apply(function() {
  // your apply function goes here
})

Upvotes: 1

Related Questions