Pyramid Embed Angular

The wrapper for @pyramid-embed/embed-js

Installation

yarn add @pyramid-embed/embed-angular

npm i @pyramid-embed/embed-angular

API documentation

Please check online help for the general documentation.

Usage

app.component.ts

import { Component } from '@angular/core';
import { EmbedOptions } from '@pyramid-embed/embed-angular';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
})
export class AppComponent {
    title = 'embed-angular-example';
    options: EmbedOptions;

    constructor() {
        this.options = {
            contentId: 'a4c7902d-f0e8-4e3c-8030-8330adf79a2c',
        };
    }
}

app.component.html

<div>
    <pyramid-embed-angular
        host="http://pyramid:8181"
        [options]="options"
        width="1280px"
        height="720px">
    </pyramid-embed-angular>
</div>

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { EmbedAngularModule } from '@pyramid-embed/embed-angular';

@NgModule({
    declarations: [AppComponent],
    imports: [BrowserModule, EmbedAngularModule],
    providers: [],
    bootstrap: [AppComponent],
})
export class AppModule {}

Properties

• host: string - URL of the Pyramid instance
• options: EmbedOptions - embed options
• width: string - container width
• height: string - container height
• loginType?: "none" | "forms" | "windows" | "saml" - authentication type
• userName?: string - username, used when loginType="forms"
• password?: string - password, used when loginType="forms"
• authToken?: string - Pyramid authentication token
• samlToken?: string - SAML token
• className?: string - apply a className to the container element
• authFailureCallback?: Function - a function that will be called when the embed token has expired

Examples

The code example uses existing embed auth cookie.

import { Component } from '@angular/core';
import { EmbedOptions, Filter } from '@pyramid-embed/embed-angular';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
})
export class AppComponent {
    title = 'embed-angular-example';
    options: EmbedOptions;

    constructor() {
        const filter = Filter.create().addUniqueName('[customer].[country].[France]');
        this.options = {
            contentId: 'a4c7902d-f0e8-4e3c-8030-8330adf79a2c',
            filters: filter
        };
    }
}

app.component.html

<div>
    <pyramid-embed-angular 
        host="http://pyramid:8181" 
        [options]='options' 
        width="1280px" 
        height="720px">
    </pyramid-embed-angular>
</div>

Further help

For more help on embedding with Pyramid, especially instructions on authentication, scenarios and use of REST APIs together with embedding, please see online help.