Autocomplete Directive for AngularJS

Added by: Sam Deering





Stars: 3

Watchers: 3

Forks: 0

Module Description


Autocomplete Directive for AngularJS

Angular Autocomplete was built with simplicity in mind assign ac-items="" attribute to a simple json array of strings or objects. If it is an array of objects specify which attribute in the object contains the autocomplete string you would like to match with ac-term="". If you are just using an array of strings do not add this attribute. Create a function to call on key up to update the item in your $scope you would like to update, along with having the ability to update any of the scope attributes you would like. Lastly add a placeholder for placeholding text before you start to use autocomplete.

View Demo:


    ).controller('exampleObjectController', function($scope) {
        $scope.items = [
            {partNum: "Q5950A"},
            {partNum: "Q5951A"},
            {partNum: "Q5952A"},

        $scope.updateObjectItems = function(typedString){
            //You can run a service here to update $scope.items with a query using typedString

<div ng-controller="exampleObjectController">
    <ng-autocomplete ac-items="items" ac-term="'partNum'" ac-keyup="updateObjectItems" placeholder="Part Number..." ng-model="partToSelectObject"></ng-autocomplete>
    Selected Item: {{partToSelectObject}}

Known Bug:

Only one instance of this directive can be used at a time, as the scope is currently shared. Working on trying to isolate the socpe.

Module stats last updated: 2015-06-08 00:21:46

Disclaimer: Some data on this page may have been gathered from the authors GitHub respository. If you see any mistakes or outdated information please let us know. Thanks!