如何自动刷新离子列表答案

【问题标题】：How to auto refresh Ionic List如何自动刷新离子列表
【发布时间】：2016-07-03 15:13:22
【问题描述】：

我正在尝试自动刷新使用 Ionic 1 显示的列表。我找到了这支笔，但无法理解它是如何工作的。

https://codepen.io/calendee/pen/GkgsD?editors=1111

下面的代码给出了我要刷新的列表

<ion-content ng-controller="myController" ng-init="init()">
          <div class="list">
             <a ng-repeat="entry in entries" class="item" ng-click="browse(entry.link)">
               <b>{{entry.title}}</b><br>
               <span ng-bind-html="entry.contentSnippet"></span>

             </a>

          </div>
      </ion-content>

$http.get("http://ajax.googleapis.com/ajax/services/feed/load", { 参数：{“v”：“1.0”，“q”： "https://community.woltlab.com/board-feed/?l=2", "num": "100" } })

app.js

var rssApp = angular.module('myApp1', ['ionic'])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if(window.cordova && window.cordova.plugins.Keyboard) {
      // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
      // for form inputs)
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

      // Don't remove this line unless you know what you are doing. It stops the viewport
      // from snapping when text inputs are focused. Ionic handles this internally for
      // a much nicer keyboard experience.
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

rssApp.controller("myController", function($http, $scope) {

    $scope.init = function() {
        $http.get("http://ajax.googleapis.com/ajax/services/feed/load", { params: { "v": "1.0", "q": "https://community.woltlab.com/board-feed/?l=2", "num": "100" } })
            .success(function(data) {
                $scope.rssTitle = data.responseData.feed.title;
                $scope.rssUrl = data.responseData.feed.feedUrl;
                $scope.rssSiteUrl = data.responseData.feed.link;
                $scope.entries = data.responseData.feed.entries;
                window.localStorage["entries"] = JSON.stringify(data.responseData.feed.entries);
            })
            .error(function(data) {
                console.log("ERROR: " + data);
                if(window.localStorage["entries"] !== undefined) {
                    $scope.entries = JSON.parse(window.localStorage["entries"]);
                }
            });
    }

        $scope.browse = function(v) {
        window.open(v, "_blank", "location=no");
    } 
});

【问题讨论】：

标签： android angularjs ionic-framework

【解决方案1】：

你需要在一定间隔后刷新数据。Angular有$interval服务，它会在指定时间后回调函数。这里是plunkerhttps://plnkr.co/edit/KB9das?p=info

$interval(function() {
reloadNumber++;
console.log('refreshed nth times ', reloadNumber)
$scope.getPosts();

}, 5000);

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope, $http, $interval) {
  $scope.name = 'World';


  var root = 'https://jsonplaceholder.typicode.com';
  var reloadNumber = 0;
  $scope.getPosts = function() {
    $http({
      url: root + '/posts',
      method: 'GET'
    }).then(function(data) {
      $scope.posts = data.data;
      console.log(data);
    });
  }
  $scope.getPosts();
  $interval(function() {
    reloadNumber++;
    console.log('refreshed nth times ', reloadNumber)
    $scope.getPosts();

  }, 5000);

});

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <link data-require="bootstrap-css@3.3.6" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" />
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <p>Hello {{name}}!</p>
  
  <table class="table">
    <thead>
    <th>
      USERID

    </th>
    <th>
      TITLE

    </th>
    <th>
      BODY

    </th>
    </thead>
    <tr ng-repeat="post in posts">
      {
      <td>{{post.userId}}

      </td>
      <td>{{post.title}}</td>
      <td>{{post.body}}</td>
    </tr>
  </table>
</body>

</html>

https://plnkr.co/edit/GgHtCQ?p=preview

【讨论】：

非常感谢@Prianca。如果可以，您能否在主帖中提供我可以用来刷新我的代码中的列表的代码？
这里是 plunker [link] (plnkr.co/edit/KB9das?p=info) 请将其标记为已回答它解决了您的问题。
我快到了。只是我正在使用 RSS 提要来提供我的列表。而且，我很难让它工作。我正在使用我的项目的 app.js 更新原始帖子。如果你也能帮助我解决它，我将不胜感激。谢谢。
在控制器中包含这个代码块 $interval(function() { $scope.init(); }, 5000);
抱歉打扰了。您能否提供我应该使用的 app.js。我是真正的初学者，这就是原因。

【解决方案2】：

 $scope.init = function() {

    $http.get("https://ajax.googleapis.com/ajax/services/feed/load", {
        params: {
          "v": "1.0",
          "q": "https://community.woltlab.com/board-feed/?l=2",
          "num": "100"
        }
      })
      .success(function(data) {
     
       $scope.data = data;
        $scope.rssTitle = data.responseData.feed.title;
        $scope.rssUrl = data.responseData.feed.feedUrl;
        $scope.rssSiteUrl = data.responseData.feed.link;
        $scope.entries = data.responseData.feed.entries;
        window.localStorage["entries"] = JSON.stringify(data.responseData.feed.entries);
      })
      .error(function(data) {
        
         $scope.data = data;
        console.log("ERROR: " + data);
        if (window.localStorage["entries"] !== undefined) {
          $scope.entries = JSON.parse(window.localStorage["entries"]);
        }
      });
  }

  $scope.browse = function(v) {
    window.open(v, "_blank", "location=no");
  }
  $interval(function() {
   $scope.init();
  }, 5000);
});

【讨论】：

对不起，如果我不应该要求其他联系方式。那你能帮我吗？自 $interval 以来，工作应用程序中只有 3 行额外代码。我不确定是什么导致了这个问题。请帮帮我..
我什至可以使用这个：ionicframework.com/docs/api/directive/ionRefresher。可能吗？
您的问题在于获取提要。请解决这个问题。您的 $https 服务进入错误块，其中响应为空。
是否有可能获得输出。的新回复？我想在通知中使用它。谢谢。