Using autocomplete in angular.js

Question

I'm building an app, which uses an autocomplete. It should be something like jQuery UI autocomplete, so if a user starts typing, it recommends him options. The thing is, that I have two kinds of data, I'm searching in. Actually, there are 'tasks' and 'projects'.

Every task has some params: task-id, task-name-display, task-name-search, project-id. Every project has: project-id, project-name-display, project-name-search, client-id, client-name.

The app should search in every of these params, but it should display only some of them. For example, if the data is:

task-id: 47
task-name-display: Task name Example
task-name-search: task-name-example
project-id: 57

And I type: 47, in dropdown I should see:

'#47 Task name Example Project A'

Again, the point of this is to make an autocomplete using angular.js, where I search in a little bit different data than I display. Is there a way how to do this simply in pure angular.js?

Is there a way how to do this also using jQuery UI autocomplete + angular.js?

Thanks.

Solution

I suppose you can use ui-autocomplete to do what you want to do.

Here is the link to ui-autocomplete

https://github.com/zensh/ui-autocomplete

Make sure you have jQuery, jQuery UI and AngularJS in your project to make this work.

Cheers!