Wordpress Rest Api 帖子获取答案

【问题标题】：Wordpress Rest Api post fetchingWordpress Rest Api 帖子获取
【发布时间】：2018-04-05 18:50:15
【问题描述】：

我正在尝试显示我的 wordpress 网站上的所有帖子。目前有2个帖子，可以在json文件中看到： View

export class HomePage {
url: string = ‘http://feederhorgasz.000webhostapp.com/wp-json/wp/v2/posts?_embed?filter[orderby]=date&order=asc1’;
items: any;

constructor(public navParams: NavParams,public navCtrl: NavController, private http:Http) {

console.log('Passed params', navParams.data);
}
ionViewDidEnter() {
this.http.get( this.url )
.map(res => res.json())
.subscribe(data =>
{
this.items = data;
console.log(“átadott wp api”,data);

    }); 
}

但是，当我尝试从 json 中读取数据时，它只列出了一个对象。（我可以在日志中看到）

【问题讨论】：

标签： angular ionic-framework wordpress-rest-api

【解决方案1】：

那是因为您告诉 Angular 从结果中获取单个值。 this.items = data; 其中items: any; 能够存储一个值，您必须定义您期望一个数据数组而不仅仅是一个对象。所以简单的答案是：

// By adding [] it will be concidered an array
items: any[];
this.http.get(this.url)
  .map(res => res.json())
  .subscribe(data: any[] => {
    //Line below will throw error if it not defined as an array
    this.items = data;
    console.log(“átadott wp api”, data);
  });

你的代码风格会导致你进入一个混乱的项目；我的意思是你不应该像现在这样把components 和services 混在一起。将服务排除在组件之外是非常有益的，因为如果您必须更改 http.get 方法之一，这将减少工作量；下线。我将添加 sn-p 以获得理想情况下的内容。

主页组件

export class HomePage {

  items: Type[];
  constructor(public navParams: NavParams, public navCtrl: NavController, private posts: HomepageService) {

    console.log('Passed params', navParams.data);
  }

  ionViewDidEnter() {
    this.post.getPosts().subscribe(data: Type[] => {
        this.items = data;
        console.log(“átadott wp api”, data);
    });
  }

主页服务

@Injectable()
export class HomepageService {
  url: string = "http://feederhorgasz.000webhostapp.com/wp-json/wp/v2/posts?_embed?filter[orderby]=date&order=asc1";

    constructor(private http: Http) {}

  getPosts(): Observable < Type[] > {
    return this.http.get(this.url)
      .map(res => res.json() as Type[])
      .catch((err: Response) => Observable.throw(console.log(err)));
  }

如你所见，如果你想改变端点的URL，你只需要更新单个文件；并非您编写该服务的所有组件。

类 (Type)

您还应该使用classes 来映射响应 JSON，以便 Angular 可以将其作为对象进行交互，而不是某种类型的字符串。 Class

【讨论】：