Angular cloud editor

Installation

npm install --save @pantherpdf/cloud-editor-angular

Example using `reportSecret`:

Report data is stored on PantherPDF database.

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { PantherpdfCloudEditorComponent } from '@pantherpdf/cloud-editor-angular';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [
    PantherpdfCloudEditorComponent,
    CommonModule,
  ],
  template: `
    <pantherpdf-cloud-editor
      [reportSecret]="reportSecret"
    >
    </pantherpdf-cloud-editor>
  `,
  styles: [
    ':host pantherpdf-cloud-editor ::ng-deep iframe { width: 100%; height: 100vh; }'
  ],
})
export class AppComponent {
  reportSecret = '...';
}

Example using `value`:

Report data is stored on customer's database.

import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { PantherpdfCloudEditorComponent, ReportCloudData } from '@pantherpdf/cloud-editor-angular';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [
    PantherpdfCloudEditorComponent,
    CommonModule,
  ],
  template: `
    <pantherpdf-cloud-editor
      [(value)]="reportValue"
      [editorKey]="editorKey"
    >
    </pantherpdf-cloud-editor>
  `,
  styles: [
    ':host pantherpdf-cloud-editor ::ng-deep iframe { width: 100%; height: 100vh; }'
  ],
})
export class AppComponent {
  editorKey: string;
  reportValue: ReportCloudData | null;

  constructor() {
    this.editorKey = '...';
    this.reportValue = null;
  }
}

Props

Parameter	Description
`[reportSecret]`	Access token for a report.
`[editorKey]`	Access token for editor.
`[lang]`	Editor language. Possible values: `en` (default, uses metric units) and `en-us` which uses imperial units.
`[(value)]`	`ReportCloudData` from customer's database.

License

MIT

Angular cloud editor

Installation

Example using reportSecret:

Example using value:

Props

License

Example using `reportSecret`:

Example using `value`: