autocomplete load data on focus

hi all

i have ac# MVC project with angular ls and entity framework

in my view i put an angucomplete with its controller

and it works properly

i want to load dropdown data when i focus in the textbox search of the autocomplete

my angular controller is

app.controller("HomeController", ['$scope', '$http', function ($scope, $http) {

$scope.countries = [];

$scope.SelectedCountries = null;

$scope.AfterSelectedCoutries = function (selected) {

if (selected) {

$scope.SelectedCountries = selected.originalObject;

}

$http.get("/Home/Get_Doctor").then(function (d) {

$scope.countries = d.data;

$timeout(function () {

var searchInput = document.getElementById('txtautocomplete');

searchInput.focus();

}, 0);

}, function (error) {

alert('Failed');

})

}])

and my HTML code is

Doctor

placeholder="Type Doctor name" pause="100"

selected-object="AfterSelectedCoutries"

local-data="countries" search-fields="Doctor_Name_Arabic"

title-field="Doctor_Name_Arabic" minlength="1"

input-class="form-control" match-class="highlight">