Bootstrap typeAhead on Angular.JS

by sirhc

HTML

<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-typeahead.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
<div ng-app>
    <h3>Typeahead with AngularJS Example</h3>
    <div class="well">
        <div>
        <input type="text" 
        ng-model="textInput"
        data-source='["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]' data-provide="typeahead" />
        </div>
        <div>
            Text: {{textInput}}
        </div>
    </div>
    <p>
        <ol>
            <li>Type into the text input field.</li>
            <li>Select any option from the Typeahead menu.</li>
            <li>Text in the model doesn't update as no <code>input</code> event was fired.</li>
        </ol>
    </p>
</div>