2017-01-07 101 views
0

我嘗試使用Ionic Framework 2解析簡單的rss feed時遇到了一些麻煩。當我運行代碼時,我沒有收到任何Feed數據。 你能幫我嗎?問題獲取Rss feed離子2

rss-service.ts

import {Injectable} from '@angular/core'; 
import {Http} from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 
import 'rxjs/add/observable/from'; 
import 'rxjs/add/operator/map'; 

@Injectable() 
export class RssService { 

    constructor(public http: Http) { 
     this.http = http; 
    } 

    load() { 

     return Observable.create(s => { 

     this.http.get('https://query.yahooapis.com/v1/public/yql?q=select%20title%2Clink%2Cdescription%20from%20rss%20where%20url%3D%22http%3A%2F%2Ffeeds.feedburner.com%2Fraymondcamdensblog%3Fformat%3Dxml%22&format=json&diagnostics=true&callback=').subscribe(res => { 
      console.log('in sub'); 
      console.dir(s); 
      var result = res.json().query.results.item; 
      result.forEach(i=>s.next(i)); 
      s.complete(); 

     }); 

     }); 
} 
} 

home.html - home.ts

<ion-header> 
    <ion-navbar color="primary"> 
     <ion-title text-center> 
      App Name 
     </ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content padding> 
    <ion-list> 
     <ion-list inset> 
      <ion-item *ngFor="let entry of entries" (click)="openPage(entry)">{{entry.title}}</ion-item> 
    </ion-list> 
    </ion-list> 
</ion-content> 

|------------------------------------------------------------| 

import { NavController } from 'ionic-angular'; 
import { Component } from '@angular/core'; 
import { RssService } from '../../providers/rss-service/rss-service'; 
import { DetailPage } from '../detail-page/detail-page'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html', 
    providers: [RssService], 

}) 
export class HomePage { 

    constructor(public rssService:RssService, public nav:NavController) { 

     this.nav = nav; 
     var entries = []; 
     this.rssService.load().subscribe(
      data => { 
       entries = data; 
      } 
    ); 

    } 

    openPage(entry) { 
     console.log('open page called with '+ entry.title); 
     this.nav.push(DetailPage, {selectedEntry:entry}); 
    } 

} 

detail-page.html - detail-page.ts

<ion-navbar *navbar> 
    <ion-title>{{entry.title}}</ion-title> 
</ion-navbar> 

<ion-content padding class="detail-page"> 
    <div [innerHTML]="entry.description"></div> 
</ion-content> 

|---------------------------------------------| 

import {NavController, NavParams} from 'ionic-angular'; 
import { Component } from '@angular/core'; 

@Component({ 
    selector: 'detail-page', 
    templateUrl: 'detail-page.html' 
}) 
export class DetailPage { 
    constructor(public nav: NavController, navParams:NavParams) { 
     console.log('run'); 
     this.nav = nav; 
     var entry = navParams.get('selectedEntry'); 
     console.log('my entry is '+ entry.title); 
    } 
} 

回答

2

請參閱代碼中的註釋。

嘗試用

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import 'rxjs/add/operator/map'; 
import {Observable} from 'rxjs/Observable'; 


@Injectable() 
export class RssService { 

    constructor(public http: Http) { 
    console.log('Hello RssService Provider'); 
    } 

    load() { 

     return Observable.create(s => { 

     this.http.get('https://query.yahooapis.com/v1/public/yql?q=select%20title%2Clink%2Cdescription%20from%20rss%20where%20url%3D%22http%3A%2F%2Ffeeds.feedburner.com%2Fraymondcamdensblog%3Fformat%3Dxml%22&format=json&diagnostics=true&callback=') 
     .map(res => res.json()) /* map res obj to json obj */ 
     .subscribe(data => { 
      console.log(data); 
      var items = data.query.results.item; 
      items.forEach(i=>s.next(i)); 
      s.complete(); 
     }); 
     }); 
} 

} 

import { NavController } from 'ionic-angular'; 
import { Component } from '@angular/core'; 
import { RssService } from '../../providers/rss-service'; 
import { DetailPage } from '../detail/detail'; 


@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html', 
}) 
export class HomePage { 

    public entries: any = []; /* this needs to be class level variable */ 

    constructor(public rssService:RssService, public nav:NavController) {  
    } 

    ionViewDidLoad(){ 
     this.rssService.load().subscribe(
      data => { 
       this.entries.push(data); /* push retrieved data into the array */ 
      } 
    ); 
    } 

    openPage(entry) { 
     console.log('open page called with '+ entry.title); 
     this.nav.push(DetailPage, {selectedEntry:entry}); 
    } 

} 
+0

感謝很多朋友,它的作品! :)現在,當我點擊一個項目時出現錯誤,但最終我會發布另一個問題 – Rick