Advanced Usage

By combining the basic and advanced features, apiNG turns into a rocket. It's nothing less than an extendable platform, where users can collaborate to create new plugins and designs.


Plnklr demo (view & edit)

Social Wall:

Table of Content


By using this components, you are able to use and create re-usable modules for your work with AngularJS.


apiNG Plugins work as data sources for specific platforms or protocols (e.g. Facebook, Youtube, RSS, GitHub, ...)

  • Plugins are easy to configure
  • Plugins could return data in two ways:
    1. as native data
    2. as converted data, transformed into several universal data models (e.g. for images, videos, events, ...)
  • Use existing plugins
  • Create your own plugin


apiNG Models are universal data models (e.g. for images, videos, events, social media, ...)

  • Models could be created or changed, just by doing it.


apiNG Designs are templates to display specific models

Credential Manager

The credential manager is a functionality of apiNG, written to relieve working with plugins, if they have to deal with api keys, access tokens, and other credentials.

Copy & paste your credentials for your requests into the config file. You can store this config file on your webspace and re-use this credentials for some projects.

apingApiKeys: {
    youtube : [{'apiKey': '<YOUR_YOUTUBE_API_KEY>'}],
    facebook: [{'access_token': '<YOUR_FACEBOOK_TOKEN>'}],
    twitter: [{'bearer_token': '<YOUR_TWITTER_BEARER_TOKEN>'}],
    vimeo: [{'access_token': '<YOUR_VIMEO_TOKEN>'}],
    tumblr: [{'api_key': '<YOUR_TUMBLR_API_KEY>'}],
    // ...

:fa-key: **Every plugin could be authorized with a credential object:**
apingApiKeys: {
    instagram : [{
        'api_key': '<YOUR_API_KEY>',
        'client_id': '<YOUR_CLIENT_ID>'
    // ...

:fa-key: **You can store multiple credentials objects _per plugin_ to bypass rate limitations.** The used credential object will get chosen randomly.
apingApiKeys: {
    facebook : [
        { 'access_token': '<YOUR_ACCESS_TOKEN_1>'},
        { 'access_token': '<YOUR_ACCESS_TOKEN_2>'},
        { 'access_token': '<YOUR_ACCESS_TOKEN_3>'},
        { 'access_token': '<YOUR_ACCESS_TOKEN_4>'}
    // ...


For advanced usage, there are two additional parameters for apiNG (bold):

template-urlstringtemplate.htmlPath to template file.
Use result data in template with {{results}}
modelstringsocialChosen data model for this apiNG instance
get-native-databooleanfalseUse true for getting native data from plugins.
Default value:false
itemsint20Number of displayed items per request
max-itemsint100Number of items of this apiNG instance.
Use -1 for no limitation
order-bystringtimestampOrder result by this attribute.
Use $NONE for no order.
Use $RANDOM for random order
order-reversebooleanfalseUse true for reverse order.
Default value: false
id-bystring or json arrayintern_id
Create id for each item by this properties.
Property name: aping_id
merge-doublesbooleanfalseUse true to merge objects with the same ID.
Works only with id-by
Default value: false
remove-doublesbooleanfalseUse true to remove identical objects
or with the same ID (id-by).
Gets ignored if merge-doubles is set.
Default value: false
payload-jsonjson object{'key1':'value1'}Inject additional payload data into your template.
Use payload data in template with {{payload}}
value-namestringvideosInject apingResults into your app. (Plnkr)
Access the results with apingResults.valueName
result-propertystringeventsChange the result-property to set the
$scope property that will contain the results.
Default value: results


Work in progress

This page is under construction