feat(typeahead): support the editable property

Closes #269

Author: pkozlowski-opensource

src/typeahead/test/typeahead.spec.js

@@ -271,6 +271,18 @@ describe('typeahead tests', function () {
         var matchHighlight = findMatches(element).find('a').html();
         expect(matchHighlight).toEqual('prefix<strong>fo</strong>o');
       });
+
+      it('should by default bind view value to model even if not part of matches', function () {
+        var element = prepareInputEl("<div><input ng-model='result' typeahead='item for item in source | filter:$viewValue'></div>");
+        changeInputValueTo(element, 'not in matches');
+        expect($scope.result).toEqual('not in matches');
+      });
+
+      it('should support the editable property to limit model bindings to matches only', function () {
+        var element = prepareInputEl("<div><input ng-model='result' typeahead='item for item in source | filter:$viewValue' typeahead-editable='false'></div>");
+        changeInputValueTo(element, 'not in matches');
+        expect($scope.result).toEqual(undefined);
+      });
     });
 
     describe('selecting a match', function () {

src/typeahead/typeahead.js

@@ -46,6 +46,9 @@ angular.module('ui.bootstrap.typeahead', [])
       //expressions used by typeahead
       var parserResult = typeaheadParser.parse(attrs.typeahead);
 
+      //should it restrict model values to the ones selected from the popup only?
+      var isEditable = originalScope.$eval(attrs.typeaheadEditable) !== false;
+
       //create a child scope for the typeahead directive so we are not polluting original scope
       //with typeahead-specific data (matches, query etc.)
       var scope = originalScope.$new();
@@ -107,7 +110,7 @@ angular.module('ui.bootstrap.typeahead', [])
           }
         }
 
-        return undefined;
+        return isEditable ? inputValue : undefined;
       });
 
       modelCtrl.$render = function () {
@@ -151,13 +154,15 @@ angular.module('ui.bootstrap.typeahead', [])
 
         } else if (evt.which === 27) {
           evt.stopPropagation();
-          scope.matches = [];
+
+          resetMatches();
           scope.$digest();
         }
       });
 
       $document.find('body').bind('click', function(){
-        scope.matches = [];
+
+        resetMatches();
         scope.$digest();
       });