Quando você está realizando projetos, a função de atualização de puxar é muito comum, então como você a implementa? Abaixo, o editor apresentará a você como usar o Ionic para implementar a função de atualização suspensa da página. Vamos dar uma olhada!
Para implementações específicas, consulte o seguinte código -fonte:
Código HTML
Refrescadora de íons: é o ícone que é atualizado pela retirada;
puxando-text = "puxando para baixo" As perguntas aqui podem ser substituídas à vontade, exatamente como;
On-refresh = "Dorefresh ()" Este é o método que precisamos executar ao puxar para baixo. Aqui estão os dados da página refrescante.
<corpo ng-app = "starter" ng-controller = "actionSheetctl"> <ion-pane> <ion-content> <ion-refresher puxando-text = "refrescha suspensa" em itemshresh = "Dorefresh ()"> </ion-refrescher "<-refresh =" ng-bind = "item.name"> </ion-item> </ion-list> </ion-content> </ion-pane> </body>
Código JavaScript
$ scope.items [] esses são os dados que acabaram de entrar na página
Dorefresh () obviamente este é o método que você executa quando deseja atualizar
Item.json É quando você clica para atualizar e precisamos re-obter dados. Este JSON é os dados mais recentes. No projeto, você precisa obter dados novamente do servidor e atualizá-los para o cliente.
angular.module ('Starter', ['Ionic']). Run (função ($ ionicPlatform) {$ ionicplatform.ready (function () {// Ocultar a barra de acessórios por padrão (remova -a para mostrar a barra de acessórios acima do teclado // para formulário) se (window.cordava && window.cord. {cordova.plugins.keyboard.hideKeyboardAccessoryBar (true);} if (window.statusbar) {statusbar.styledefault ();}});}). , '$ http', função ($ scope, $ timeout, $ http) {$ scope.items = [{"name": "html5"}, {"name": "javascript"}, {"name": "css3"}]; $ scope.Dresh}, (name ":" css3 "}]; Problemas de domínio cruzado $ http.get ('http://www.aliyue.net/demo_source/item.json') .success (function (newItems) {$ scope.items = newItems;}). {$ scope. $ transmite ('scroll.refreshcomplete');});};}])))Dados do arquivo Item.json:
[{"Name": "Rookie Tutorial"}, {"Name": "www.aliyue.net"}]IMPLEMAS IONICA Atualização suspensa da página (função refrescadora de íons) e o apresentará muito. No futuro, apresentarei como implementar o carregamento deslizante e mais funções. Continue prestando atenção ao conteúdo emocionante trazido a você pelo Wulin.com.