forked from Siyfion/angular-typeahead
-
Notifications
You must be signed in to change notification settings - Fork 0
/
angular-typeahead.js
95 lines (83 loc) · 3.46 KB
/
angular-typeahead.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
angular.module('typeahead-module', [])
.directive('typeahead', function () {
"use strict";
return {
restrict: 'E', // Only apply on an attribute or class
require: '^?bootstrapTagsinput',
scope: {
value: '=ngModel', // The two-way data bound value that is returned by the directive
options: '=', // The typeahead configuration options (https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md#options)
datasets: '=' // The typeahead datasets to use (https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md#datasets)
},
link: function (scope, element) {
// Create the typeahead on the element
element.typeahead(scope.options, scope.datasets);
function getCursorPosition (element) {
var position = 0;
element = element[0];
// IE Support.
if (document.selection) {
var range = document.selection.createRange();
range.moveStart('character', -element.value.length);
position = range.text.length;
}
// Other browsers.
else if (typeof element.selectionStart === 'number') {
position = element.selectionStart;
}
return position;
}
function setCursorPosition (element, position) {
element = element[0];
if (document.selection) {
var range = element.createTextRange();
range.move('character', position);
range.select();
}
else if (typeof element.selectionStart === 'number') {
element.focus();
element.setSelectionRange(position, position);
}
}
function updateScope (object, suggestion, dataset) {
// for some reason $apply will place [Object] into element, this hacks around it
var preserveVal = element.val();
scope.$apply(function () {
scope.value = suggestion;
});
element.val(preserveVal);
}
// Update the value binding when a value is manually selected from the dropdown.
element.bind('typeahead:selected', function(object, suggestion, dataset) {
updateScope(object, suggestion, dataset);
scope.$emit('typeahead:selected');
});
// Update the value binding when a query is autocompleted.
element.bind('typeahead:autocompleted', function(object, suggestion, dataset) {
updateScope(object, suggestion, dataset);
scope.$emit('typeahead:autocompleted');
});
// Propagate the opened event
element.bind('typeahead:opened', function() {
scope.$emit('typeahead:opened');
});
// Propagate the closed event
element.bind('typeahead:closed', function() {
scope.$emit('typeahead:closed');
});
// Propagate the cursorchanged event
element.bind('typeahead:cursorchanged', function(event, suggestion, dataset) {
scope.$emit('typeahead:cursorchanged', event, suggestion, dataset);
});
// Update the value binding when the user manually enters some text
element.bind('input', function () {
var preservePos = getCursorPosition(element);
scope.$apply(function () {
var value = element.val();
scope.value = value;
});
setCursorPosition(element, preservePos);
});
}
};
});