How should I setup the use of typeahead with Angular JS?

I'm trying to use typeahead.js but all I'm getting is Uncaught TypeError: undefined is not a function.

I'm:

• Loading it after jQuery
• Not using $(document).ready(...) anywhere in my scripts
• Using Angular JS (even I don't think it's an issue)
• Loading jQuery after whole angular stuff
• Made sure all scripts exist and are being loaded.

This is what my whole resources loading looks like (with out typeahead load):

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="http://bootswatch.com/flatly/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.3/animate.min.css">
<link rel="stylesheet" type="text/css" href="css/rules.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.3.1/lodash.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-route.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-cookies.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular-animate.min.js"></script>
<script type="text/javascript" src="js/angular/dependencies/checklist-model.js"></script>

<script type="text/javascript" src="js/jQuery/jquery.js"></script>  THIS NOT ANOTHER jQuery
<script type="text/javascript" src="js/functions.js"></script>

Important:

<script type="text/javascript" src="js/jQuery/jquery.js"></script> is NOT another jQuery, it's just a function which does some selections.

What I've tried for loading (after all those sripts):

• Loading the bundle:

  <script type="text/javascript" src="js/dependencies/typeahead.bundle.min.js"></script>

• Loading both typeahead and bloodhound:

<script type="text/javascript" src="js/dependencies/typeahead.jquery.min.js"></script> <script type="text/javascript" src="js/dependencies/bloodhound.min.js"></script>

• Loading even a bootstrap3 version of typeahead:

  <script type="text/javascript" src="js/dependencies/bootstrap3-typeahead.min.js"></script>

None of these worked, I looked for any issues on github but didn't find ... This is what I'm getting, and just in case, I'm using last version of Chrome.

Update | Found the issue

I found out what's causing it, but I can't fingure out or understand why and how to fix it.

So, jQuery/jquery.js, which is NOT another jQuery is the file making it all fail and looks exactly like this:

function dojQuery () {

  $(".hover-resize").hover(

    function() { $(this).css("font-size","95px"); },
    function() { $(this).css("font-size","75px"); }
  );

  $('.dropdown-toggle').click(function() {
      var location = $(this).attr('href');
      window.location.href = location;
      return false;
  });

  $('#modifyItemModal').on('hidden.bs.modal', function () {
    $("#myOrderReview").modal('show');
  });

  $('#reviewConfirmationModal').on('hidden.bs.modal',function() {
    $("#orderReview").modal('show');
  });

  $('.supervisorModal').on('hidden.bs.modal',function() {
    $("#orderReview").modal('show');
  });

};

And the function declared is being called one within an Angular controller by simple invoking dojQuery(); Not including the fie invoking the function makes it all work good for tyepeahead.... Finally I guess it's about the jquery conflict stuff but I can't understand the fix.