Pptx NPM | npm.io

Pptx

This library was generated with Angular CLI version 9.0.7.

How to use library

Run npm i pptx and then npm i pptxgenjs --save in terminal to install library
In your appliaction, include this code in your component

import { Component, OnInit } from '@angular/core';
import {PptComponent, IContact, IIntro, IAgenda, JsonService} from 'pptx';

@Component({
  providers:[PptComponent],
  selector: 'app-root',
  //this template creates example page with button that generate example presentation
  template:`<h1 class="text-primary font-weight-light">GBS PowerPoint master slides</h1>
  <button (click)="makePresentation()">Generate presentation from other component</button>`,
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  public AgendaArr: IAgenda;
  public IntroArr: IIntro;
  public ContactArr: IContact;

  constructor(private comp: PptComponent, private jsonService: JsonService ) { }

  ngOnInit() {
    this.jsonService.getHeader()
      .subscribe(data => this.AgendaArr = data);
    this.jsonService.getIntro()
      .subscribe(data => this.IntroArr = data);
    this.jsonService.getContact()
      .subscribe(data => this.ContactArr = data);
}

public makePresentation(): void {
  this.comp.presentation().doIntro(this.IntroArr).doAgenda(this.AgendaArr).doQuestions().doThanks().doContact(this.ContactArr).save();
}
}

If you want to use example page with button that creates example presentation, you need to include HttpClientModule in your app module.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';

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

Run json-server --watch db.json in terminal to simulate JSON Server, where data for the presentation will be stored
Previous step should have created db.json file in your directory. Rewrite it in order to match required format for the data. For example:

{
  "header": {
    "agendaInfo": "Lorem ipsum"
  },
  "intro": {
    "header": "Arial Bold, 44 pt Lorem ipsum dolor Lorem ipsum dolor",
    "subhead": "Subhead, Arial Regular, 22 pt Smart panel width can be freely chosen"
  },
  "contactInfo": {
    "name": "JSON DOE",
    "title": "Siemens CEO",
    "group": "GBS / Prague / Department GMS",
    "street": "Siemensova 123",
    "postcode": "14000 Prague",
    "phone": "Phone: +49 123123415864",
    "fax": "Fax: +49 123 45 67 89",
    "mobile": "Mobile: +49 45646548648",
    "email": "E-mail: json.doe@siemens.com",
    "headerText": "Header text from JSON server. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras pede libero, dapibus nec, pretium sit amet, tempor quis. Curabitur vitae diam non enim vestibulum interdum."

  }
}