Campo de entrada HTML
<input type="text" ng-model="searchText" ng-change="change(text)" placeholder="filter" />
Controlador Angular
A parte $ scope.change será chamada sempre que os dados do campo de entrada forem alterados (adicionar, remover etc.)
valtosend são os dados de entrada inseridos no campo de entrada
App.controller('MainController', function($scope, $http, $timeout) {
$scope.searchText = null;
$scope.change = function(text) {
valtosend = $scope.searchText;
$http.get('http://website/getdatafunction/' + valtosend).then(function(result){
$scope.entries = result.data;
});
};
});
Dados devolvidos
Minha função getdatafunction é PHP, MySQL e Codeigniter, você pode obviamente usar a sua própria para isso.
Eu aplico os recursos de segurança óbvios para negar entrada indecente e, em seguida, busco as informações do banco de dados e echo os dados retornados como
echo json_encode($query);
De volta à página principal sob o campo de entrada, tenho minha lista aguardando dados sendo retornados
Ela então faz um loop por todos os dados retornados e exibe na tela
<li ng-repeat="entry in entries">
<span class="{{entry.classname}}"><a href="{{entry.link}}">{{entry.title}} - {{entry.info}}</a></span>
</li>
Meu $ scope.change dispara 5 funções getdatafunction
Em cada uma delas eu altero as entradas que fazem parte deste
$scope.entries = result.data;
para outro nome de variável que está então esperando em outro li
ie
$scope.change = function(text) {
valtosend = $scope.searchText;
$http.get('http://website/getdatafunction/' + valtosend).then(function(result){
$scope.entries = result.data;
});
$http.get('http://website/getdatafunction/' + valtosend).then(function(result){
$scope.persons = result.data;
});
repeat x 3 more
};
<li ng-repeat="entry in entries">
<span class="{{entry.classname}}"><a href="{{entry.link}}">{{entry.title}} - {{entry.info}}</a></span>
</li>
<li ng-repeat="person in persons">
<span class="{{person.classname}}"><a href="{{entry.link}}">{{person.name}} - {{person.jobtitle}}</a></span>
</li>
lá vai ser a melhor maneira de recuperar 5 conjuntos de dados de um campo de entrada, mas eu pensei que eu iria partilhar a minha maneira!