Model

Use @WpModel decorator whenever you want to perform CRUD operations

WpModel Decorator

@WpModel (endpoint: string)

• endpoint: Required parameter to set the endpoint target, e.g. posts

WpModel Example

Get a single post by id

import { Component } from '@angular/core';
import { WpModel, WpModelRef } from '@ngx-wordpress/core';

@Component({
  selector: 'app-single-post-page',
  template: `
    <div *ngIf="wpModel.state | async; let state">
    
        <span *ngIf="state.error" class="error">{{ state.error.message }}</span>
      
        <span *ngIf="state.loading" class="spinner">Loading...</span>
        
        <div *ngIf="state.data" class="post">
          <div class="post-title">{{ state.data.title }}</div>
          <div class="post-content" [innerHTML]="state.data.content"></div>
        </div>
    </div>
  `,
})
export class SinglePostPageComponent {

  @WpModel('posts') wpModel: WpModelRef;

  ngOnInit() {
    this.wpModel.get(17).subscribe();
  }
}

WpModelRef API

Name	Description
state	Stream that emits collection state
data	Stream that emits collection data array
loading	Stream that emits collection loading state
error	Stream that emits when an error occurs
get(id)	Get a single object by id
create(body)	Create an object
update(id, body)	Update an existing object by id
delete(id)	Delete an existing object by id
destroy()	Closes the state stream and un-subscribers all its subscriptions