From c5cc0f95fd1b3e9efcc5abf1bcb67b7b1875b453 Mon Sep 17 00:00:00 2001 From: Roarke Gaskill Date: Mon, 18 Mar 2013 22:19:30 -0500 Subject: [PATCH 1/2] A possible implementation of an input renderer. --- src/typeahead/docs/demo.html | 2 +- src/typeahead/docs/demo.js | 7 +++++++ src/typeahead/typeahead.js | 13 ++++++++++--- 3 files changed, 18 insertions(+), 4 deletions(-) diff --git a/src/typeahead/docs/demo.html b/src/typeahead/docs/demo.html index d14f6a46e4..4568dc4fb1 100644 --- a/src/typeahead/docs/demo.html +++ b/src/typeahead/docs/demo.html @@ -1,4 +1,4 @@
Model: {{selected| json}}
- +
\ No newline at end of file diff --git a/src/typeahead/docs/demo.js b/src/typeahead/docs/demo.js index 370655c956..1587b5d988 100644 --- a/src/typeahead/docs/demo.js +++ b/src/typeahead/docs/demo.js @@ -2,4 +2,11 @@ function TypeaheadCtrl($scope) { $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.testFormatter = function(item){ + if ( item ) { + return item.toUpperCase(); + } + return item; + }; } \ No newline at end of file diff --git a/src/typeahead/typeahead.js b/src/typeahead/typeahead.js index 3614f1b239..0909ce144d 100644 --- a/src/typeahead/typeahead.js +++ b/src/typeahead/typeahead.js @@ -46,6 +46,9 @@ angular.module('ui.bootstrap.typeahead', []) //expressions used by typeahead var parserResult = typeaheadParser.parse(attrs.typeahead); + //optional formatter for the input field + var formatter = originalScope.$eval(attrs.typeaheadInputFormatter); + //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(); @@ -113,7 +116,11 @@ angular.module('ui.bootstrap.typeahead', []) modelCtrl.$render = function () { var locals = {}; locals[parserResult.itemName] = selected || modelCtrl.$viewValue; - element.val(parserResult.viewMapper(scope, locals) || modelCtrl.$viewValue); + var value = parserResult.viewMapper(scope, locals) || modelCtrl.$viewValue; + if ( formatter ){ + value = formatter(value); + } + element.val(value); selected = undefined; }; @@ -122,8 +129,8 @@ angular.module('ui.bootstrap.typeahead', []) var locals = {}; locals[parserResult.itemName] = selected = scope.matches[activeIdx].model; - modelCtrl.$setViewValue(parserResult.modelMapper(scope, locals)); - modelCtrl.$render(); + originalScope[attrs.ngModel] = parserResult.modelMapper(scope, locals); + resetMatches(); }; //bind keyboard events: arrows up(38) / down(40), enter(13) and tab(9), esc(27) From 455a45beed54b1c9ee2b447ce8229968762b185c Mon Sep 17 00:00:00 2001 From: rgaskill Date: Tue, 19 Mar 2013 06:50:49 -0500 Subject: [PATCH 2/2] update to handle arrays of objects --- src/typeahead/typeahead.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/typeahead/typeahead.js b/src/typeahead/typeahead.js index 0909ce144d..f889a3392b 100644 --- a/src/typeahead/typeahead.js +++ b/src/typeahead/typeahead.js @@ -115,12 +115,16 @@ angular.module('ui.bootstrap.typeahead', []) modelCtrl.$render = function () { var locals = {}; + locals[parserResult.itemName] = selected || modelCtrl.$viewValue; - var value = parserResult.viewMapper(scope, locals) || modelCtrl.$viewValue; + var viewValue = parserResult.viewMapper(scope, locals) || modelCtrl.$viewValue; + var modelValue; + if ( formatter ){ - value = formatter(value); + modelValue = parserResult.modelMapper(scope, locals); + viewValue = formatter(modelValue) || viewValue; } - element.val(value); + element.val(viewValue); selected = undefined; };