Simple RSS reader

ionic-v1
1

Hi all,
being a 4 days beginner with a long php experience, I’m trying ionic.
So my first test is to make a quick and dirty rss reader.
I got a good angular example here : http://jsfiddle.net/mahbub/b8Wcz/
and I did some funky stuff to adapt it :smile:
Now I have something that rock on when I try it with ionic serve
but when I build and run on android the feed does not work. Does it handle Internet right in android if I only run ?

Thanks for your reading

PS : my conttrollers

  .controller("FeedCtrl", ['$scope','FeedService', function ($scope,Feed) {
      $scope.loadButonText="Load";
      $scope.loadFeed=function(feedSrc){
          Feed.parseFeed(feedSrc).then(function(res){
              $scope.feeds = res.data.responseData.feed.entries;
          });
      };
      $scope.loadFeed('http://www.bonjourmadame.fr/rss');
  }])

  .factory('FeedService',['$http',function($http){
      return {
          parseFeed : function(url){
              return $http.jsonp('//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=50&callback=JSON_CALLBACK&q=' + encodeURIComponent(url));
          }
      }
  }])

  .filter('clean', function() {
    return function(input) {
      var myRegex = /<img src="(.+)"><br>/
      var out = myRegex.exec(input);
      return out[1];
    };
  });

PS2 : I also tried to build and emulate on a mac with the same problem… the feed doesn’t load

2

You may have to disable $sceProvider in your angular config setup.

$sceProvider.enabled(false);

3

I did it and it doesn’t change still not loading the feed.
here is the app.js

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
// 'starter.services' is found in services.js
// 'starter.controllers' is found in controllers.js
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])

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

.config(function($stateProvider, $urlRouterProvider, $sceProvider) {

  $sceProvider.enabled(false)

  // Ionic uses AngularUI Router which uses the concept of states
  // Learn more here: https://github.com/angular-ui/ui-router
  // Set up the various states which the app can be in.
  // Each state's controller can be found in controllers.js
  $stateProvider

    // setup an abstract state for the tabs directive
    .state('tab', {
      url: "/tab",
      abstract: true,
      templateUrl: "templates/tabs.html"
    })

    // Each tab has its own nav history stack:

    .state('tab.dash', {
      url: '/dash',
      views: {
        'tab-dash': {
          templateUrl: 'templates/tab-dash.html',
          controller: 'FeedCtrl'
        }
      }
    })

    .state('tab.friends', {
      url: '/friends',
      views: {
        'tab-friends': {
          templateUrl: 'templates/tab-friends.html',
          controller: 'FriendsCtrl'
        }
      }
    })
    .state('tab.friend-detail', {
      url: '/friend/:friendId',
      views: {
        'tab-friends': {
          templateUrl: 'templates/friend-detail.html',
          controller: 'FriendDetailCtrl'
        }
      }
    })

    .state('tab.account', {
      url: '/account',
      views: {
        'tab-account': {
          templateUrl: 'templates/tab-account.html',
          controller: 'AccountCtrl'
        }
      }
    })

  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/tab/dash');

});

and the tab dash template :

<ion-view title="Accueil">
<ion-content class="has-header padding">

<div class="list">

    <a class="item item-thumbnail-left" href="{{feed.link}}" ng-repeat="feed in feeds | filter:filterText">
      <img src='{{feed.content | clean}}'>
      <h2>{{feed.title}}</h2>
      <pre>{{feed}}</pre>
    </a>

</div>

</ion-content>
</ion-view>

In case it could help to identify my bug.

Thanks

4

Hey, It’s been a month, so maybe you already fixed it.
But I had the same problem today so maybe this is nice for future reference.
After wasting hours on obscure fixes, this was the retardely easy fix that made it work for me:

you have to put http:// in front of your feed url. So it becomes this: return $http.jsonp('http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=50&callback=JSON_CALLBACK&q=' + encodeURIComponent(url));

5

How I can add refresher feature to these script like OP said?