Очевидно, это вызвано тем, что я новичок в AngularJS, но я не знаю, в чем проблема.
По сути, у меня есть список элементов и элемент управления вводом для фильтрации списка, который находится во всплывающем боковом ящике.
Это работает отлично, пока я не добавил директиву для установки фокуса на этот элемент управления вводом, когда он становится видимым. Потом фокус работает, но фильтр перестает работать. Нет ошибок. Удаление focus="{{open}}" из разметки заставляет фильтр работать.
Метод фокусировки был взят из этого сообщения StackOverflow: Как установить фокус на поле ввода? а>
Вот код...
/* impersonate.html */
<section class="impersonate">
<div header></div>
<ul>
<li ng-repeat="item in items | filter:search">{{item.name}}</li>
</ul>
<div class="handle handle-right icon-search" tap="toggle()"></div>
<div class="drawer drawer-right"
ng-class="{expanded: open, collapsed: !open}">
Search<br />
<input class="SearchBox" ng-model="search.name"
focus="{{open}}" type="text">
</div>
</section>
// impersonateController.js
angular
.module('sales')
.controller(
'ImpersonateController',
[
'$scope',
function($scope) {
$scope.open = false;
$scope.toggle = function () {
$scope.open = !$scope.open;
}
}]
);
// app.js
angular
.module('myApp')
.directive('focus', function($timeout) {
return {
scope: { trigger: '@focus' },
link: function(scope, element) {
scope.$watch('trigger', function(value) {
if(value === "true") {
console.log('trigger',value);
$timeout(function() {
element[0].focus();
});
}
});
}
};
})
Будем очень благодарны любой помощи!
Спасибо! Тад