element.chosen is not a function

Question

I'm using the chosen-bower install with Angular, but each time I run the app on my server I get the "element.chosen is not a function." jQuery is defined before Angular, and when I run $('select').chosen() AFTER load, it works fine. It must be something with the way the directive loads.

My directive is as follows:

.directive('chosen', function($timeout) {

  var linker = function(scope, element, attr) {

    $timeout(function () {
      element.chosen({
        placeholder_text_single: "-- select venue --"
      });
    }, 0, false);
  };

  return {
    restrict: 'A',
    link: linker
  };
});

Edit: I want to note that this works completely fine when I use grunt serve

Answer 1

Try to install chosen and include it after jquery.