/ / Trigger kliknij, aby aktywować typeahead po tym, jak element zostanie zogniskowany - angularjs, onclick, focus, typeahead.js

Kliknij, aby aktywować nagłówek po tym, jak element się skupi - angularjs, onclick, focus, typeahead.js

Potrzebujesz pomocy z kilkoma problemami. Oto uproszczony kod:

HTML

    <input type="text" title="{{e.Name}}" ng-model="e.modelName" ng-required="true" typeahead-editable="false" ng-blur="vm.isUnchanged(i)" focus-me="vm.Event"
own-typeahead typeahead-on-select="vm.changeValue($item, $model, $label, i)"
uib-typeahead="$Event, $viewValue)" typeahead-min-length="0"/>

JS

app.directive("ownTypeahead", function() {
var directive = {
link: link,
scope: true,
restrict: "A",
require: ["ngModel"]
};
return directive;

function link(scope, element, attrs, ctrls) {

element.bind("click", function () {
if (ctrls[0].$viewValue && ctrls[0].$viewValue == " ") {
ctrls[0].$setViewValue("");
}
ctrls[0].$setViewValue(" ");
});

element.bind("focus", function () {
if (!ctrls[0].$viewValue || ctrls[0].$viewValue == "") {
ctrls[0].$setViewValue(" ");
}
});
}
});


/**
* Directive that places focus on the element it is applied to when the
* expression it binds to evaluates to true
*/
app.directive("focusMe", ["$timeout", function focusMe($timeout) {
return function (scope, elem, attrs) {
scope.$watch(attrs.focusMe, function (newVal) {
if (newVal) {
$timeout(function () {
elem[0].focus();
}, 0, false);
}
});
};
}]);

Problemy / pytania to:

1) Główny. Skoncentruj się po kliknięciu wyzwalaczy niektórych elementów naprzód ddl w polu wprowadzania prawie zawsze, ale tamjest kilka elementów, które poruszają się, ale nie powodują otwarcia listy. Masz jakieś pomysły, gdzie jest problem? (powyższy kod działa w około 90% przypadków i w 100% po kliknięciu pola wprowadzania)

2) Nie jest to idealne rozwiązanie, ale można zastosować obejście tego problemu Kliknij zdarzenie w skoncentrowanym polu wejściowym, aby otworzyć listę. Nie da się tego zrobić poprawnie kątowo. Jak można to zrobić?

Odpowiedzi:

0 dla odpowiedzi № 1

Działa, dodając 200ms limit czasu dla focusMe:

app.directive("focusMe", ["$timeout", function focusMe($timeout) {
return function (scope, elem, attrs) {
scope.$watch(attrs.focusMe, function (newVal) {
if (newVal) {
$timeout(function () {
elem[0].focus();
}, 200, false);
}
});
};
}]);

Jeśli ktoś ma lepsze sugestie, zaakceptuje odpowiedź.