Klar ausgewählte Eingang in angular bootstrap typeahead

Ich bin mit http://angular-ui.github.io/bootstrap/#/typeahead für ein einfacher array-lookup-Beispiel.

Möchte ich auslösen list() wenn ich leere die input Feld und drücken Sie die EINGABETASTE. Derzeit könnte ich ein anderes Programm Clear - Taste, um dies zu tun. Aber wie keypress, wenn die Eingabe leer ist? Ich möchte Benutzer wählen Sie aus der Liste oder deaktivieren Sie es nur. Es sollten keine anderen Werte.

HTML

<!doctype html>
<html ng-app="plunker">

<head>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.8/angular.js"></script>
  <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>
  <script src="example.js"></script>
  <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>

  <script type="text/ng-template" id="customTemplate.html">
    < a > < img ng - src = "http://upload.wikimedia.org/wikipedia/commons/thumb/{{match.model.flag}}"
    width = "16" > < span bind - html - unsafe = "match.label | typeaheadHighlight:query" > < /span>
  </a >
  </script>
  <div class='container-fluid' ng-controller="TypeaheadCtrl">

    <h4>Static arrays</h4>
    <pre>Model: {{selected | json}}</pre>
    <input type="text" typeahead-on-select="list()" ng-model="selected" typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">
    <button ng-click="clear()">Clear</button>
  </div>
</body>

</html>

Javascript

angular.module('plunker', ['ui.bootstrap']);
function TypeaheadCtrl($scope, $http) {

  $scope.selected = undefined;
  $scope.states = ['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'];

  $scope.list = function() {
    alert($scope.selected);
  }

  $scope.clear = function() {
    $scope.selected = undefined;
    $scope.list();
  }
}

http://plnkr.co/edit/roushmavR67rhXTJNc8K?p=preview

InformationsquelleAutor HP. | 2014-03-17
Schreibe einen Kommentar