5
Sto provando a fare due modi di filtrare (facendo clic sulle lettere o digitando il campo di inserimento).Non funziona in due modi di filtraggio (AngularJS)
<body ng-controller="MainController">
<ul search-list=".letter" model="search">
<li class="letter" ng-repeat="letter in alphabet.letter">{{ letter }}</li>
</ul>
<div class="container" ng-controller="CountriesController">
<input id="q" type="text" ng-model="search " />
<ul>
<li ng-repeat="country in countries.country | filter:search:startsWith">{{ country }}</li>
</ul>
</div>
</body>
e JS:
var app = angular.module('demo', []);
var controllers = {};
var alphabet = "abcdefghijklmnopqrstuvwxyz".split("");
app.directive('searchList', function() {
return {
scope: {
searchModel: '=model'
},
link: function(scope, element, attrs) {
element.on('click', attrs.searchList, function() {
scope.searchModel = $(this).text();
scope.$apply();
});
}
};
});
controllers.MainController = function($scope) {
$scope.setTerm = function(letter) {
$scope.search = letter;
};
$scope.alphabet = {
letter: alphabet
}
};
controllers.CountriesController = function($scope){
$scope.countries = {
country:['Ukraine','Urugvai','Russia','Romania','Rome','Argentina','Britain']
}
$scope.startsWith = function (actual, expected) {
var lowerStr = (actual + "").toLowerCase();
return lowerStr.indexOf(expected.toLowerCase()) === 0;
}
};
app.controller(controllers);
Al primo sguardo tutto funziona bene, ma è così solo sul primo sguardo ...
Quando in un primo momento mi cliccare su una lettera - Filtro funziona bene Quando poi sto digitando il campo di input, il filtro funziona bene. Ma dopo aver digitato il campo di input o eliminare il testo da lì tramite il pulsante 'backspace' - il filtro facendo clic sulle lettere smette di funzionare ...
Perché funziona così e come posso risolvere questo problema? Ecco il mio DEMO
Grazie in anticipo!
Il problema è portata eredità. Nel momento in cui digiti effettivamente nel campo di input, l'ambito di 'CountriesController' avrà il suo valore per' search' e non lo erediterà più da 'MainController'. Questo problema potrebbe essere risolto se segui la [dot-rule] (http://stackoverflow.com/q/17606936/697154). – Yoshi