how to make jquery autocomplete in angular js

could you please tell me how to make jquery autocomplete in angular js.I am trying to make this type of autocomplete in angular js http://jsfiddle.net/dfapnrxf/

or this https://jqueryui.com/autocomplete/

so I make custom directive .but could you please tell me where I am doing wrong ?here is my code

http://codepen.io/anon/pen/eNZLpp

var app=angular.module("ionicApp",['ionic']);
app.directive('autosemple',function(){

    return{
        restrict:'A',
        scope:{

        },
        link:function(scope,element,attr){
            $( "#tags" ).autocomplete({
              //  source: availableTags
            });
        }
    }
})
app.controller('cnt',function($scope){
    $scope.availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];
})