angular-typeahead's Introduction

sfTypeahead: A Twitter Typeahead directive

A simple Angular.js directive wrapper around the Twitter Typeahead library.

License: MIT

Getting Started

How you acquire angular-typeahead is up to you.

Preferred method:

Install with Bower: $ bower install angular-typeahead

Other methods:

Download latest angular-typeahead.js or angular-typeahead.min.js.

Note: angular-typeahead.js has dependencies on the following libraries:

All of which must be loaded before angular-typeahead.js.

Usage

The bare bones:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="typeahead.js"></script>
<script type="text/javascript" src="angular.js"></script>
<script type="text/javascript" src="angular-typeahead.js"></script>
<script>
  // Create the application and import the siyfion.sfTypeahead dependency.
  angular.module('myApp', ['siyfion.sfTypeahead']);
</script>
<body ng-app="myApp">
    <input type="text" class="sfTypeahead" datasets="exampleData" ng-model="foo"></div>
<body>

// Define your own controller somewhere...
function MyCtrl($scope) {

  // single dataset
  $scope.exampleData = {
    name: 'accounts',
    local: ['timtrueman', 'JakeHarding', 'vskarich']
  };

  $scope.multiExample = {
    {
      name: 'accounts',
      prefetch: 'https://twitter.com/network.json',
      remote: 'https://twitter.com/accounts?q=%QUERY'
    },
    {
      name: 'trends',
      prefetch: 'https://twitter.com/trends.json'
    }
  };

  $scope.foo = null;
};

Recommend Projects