Wordpress Rest Api 帖子获取

Posted 2023-02-19

【中文标题】Wordpress Rest Api 帖子获取

【英文标题】：Wordpress Rest Api post fetching

【发布时间】：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 中读取数据时，它只列出了一个对象。 （我可以在日志中看到）

【参考方案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