npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@tomaszatoo/ngx-wp-api

v0.2.8

Published

`ngx-wp-api` is an Angular library that provides a convenient way to interact with the WordPress REST API v2. This library simplifies the process of retrieving and managing WordPress content, including **posts, categories, tags, users, and menus**, using

Downloads

29

Readme

ngx-wp-api

ngx-wp-api is an Angular library that provides a convenient way to interact with the WordPress REST API v2. This library simplifies the process of retrieving and managing WordPress content, including posts, categories, tags, users, and menus, using Angular's HttpClient.

Note: To get menus, the WordPress site must have the WP-REST-API V2 Menus plugin installed. Otherwise you will get the 404 error.

Installation

To install the library, use npm:

npm install @tomaszatoo/ngx-wp-api

Usage

Importing the Library and configuring the API URL

You can configure the library by providing the WordPress site URL with active REST API in your app.config:

import { provideHttpClient } from '@angular/common/http';
import { provideNgxWpApi } from '@tomaszatoo/ngx-wp-api';
// ...

export const appConfig: ApplicationConfig = {
  providers: [
    // ...
    /* NGX-WP-API REQUIRED SETUP */
    provideHttpClient(),
    provideNgxWpApi({
      wpRootUrl: 'https://your-wordpress-site.com'
    })
  ]
};

or in your app.module:

import { NgxWpApiModule } from '@tomaszatoo/ngx-wp-api';

@NgModule({
  imports: [
    // Other imports
    NgxWpApiModule.forRoot({
      wpRootUrl: 'https://your-wordpress-site.com',
      // other config options
    })
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Authenticating Users

To authenticate users using Basic Authentication, you can use the authenticate method:

import { NgxWpApiService } from '@tomaszatoo/ngx-wp-api';

constructor(private wpApiService: NgxWpApiService) {}

this.wpApiService.authenticate('your_username', 'your_password');

Available Interfaces

The library has defined these interfaces:

import {
    Post,
    Category,
    Tag,
    Media,
    User,
    Page,
    MenuItem,
    Menu,
    SiteInfo
} from '@tomaszatoo/ngx-wp-api'

Using the API

You can use the library to interact with various WordPress endpoints:

Get Posts

this.wpApiService.getPosts().subscribe(posts => {
  console.log(posts);
});

Get Categories

this.wpApiService.getCategories().subscribe(categories => {
  console.log(categories);
});

Get Menus

Note: To get menus, the WordPress site must have the WP-REST-API V2 Menus plugin installed. Otherwise you will get the 404 error.

this.wpApiService.getMenus().subscribe(menus => {
  console.log(menus);
});

Available Methods

The following methods are available in the NgxWpApiService:

Note: If observeResponse is set to true, selected methods will return HttpResponse with headers. This can be useful to get specific WordPress REST API v2 headers such as X-WP-Total or X-WP-TotalPages (see: Pagination). If observeResponse is set to default false, all methods will only return the response body with appropriate objects.

  • Post Methods

    • getPosts(args?: string, observeResponse: boolean = false): Observable<Post[] | HttpResponse<any>>
    • getPost(id: number): Observable<Post>

    See: Post Methods arguments

  • Category Methods

    • getCategories(args?: string, observeResponse: boolean = false): Observable<Category[] | HttpResponse<any>>
    • getCategory(id: number): Observable<Category>

    See: Category Methods arguments

  • Tag Methods

    • getTags(args?: string, observeResponse: boolean = false): Observable<Tag[] | HttpResponse<any>>
    • getTag(id: number): Observable<Tag>

    See: Tag Methods arguments

  • Media Methods

    • getMedias(args?: string, observeResponse: boolean = false): Observable<Media[] | HttpResponse<any>>
    • getMedia(id: number): Observable<Media>

    See: Media Methods arguments

  • User Methods

    • getUsers(args?: string, observeResponse: boolean = false): Observable<User[] | HttpResponse<any>>
    • getUser(id: number): Observable<User>

    See: User Methods arguments

  • Page Methods

    • getPages(args?: string, observeResponse: boolean = false): Observable<Page[] | HttpResponse<any>>
    • getPage(id: number): Observable<Page>

    See: Page Methods arguments

  • Menu Methods

    • getMenus(): Observable<any>
    • getMenu(idOrSlug: number | string): Observable<Menu>
  • Site Info

    • getSiteInfo(): Observable<SiteInfo>

License

This library is licensed under the MIT License.