Skip to content

Instantly share code, notes, and snippets.

@h-maac

h-maac/app.component.ts

Created December 12, 2018 14:36
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save h-maac/8d820dfb6437708ea8bb0d5017be9f69 to your computer and use it in GitHub Desktop.
Save h-maac/8d820dfb6437708ea8bb0d5017be9f69 to your computer and use it in GitHub Desktop.
Download ZIP
Angular2+ Html to Docx
Raw
app.component.ts
import { Component} from '@angular/core';
import * as htmlDocx from 'node_modules/html-docx-js/dist/html-docx.js';
import saveAs from 'src/app/fileSaver.js';
@Component({
selector: 'app-root',
template: `
<app-docx id="docx"></app-docx>
<button (click)="download()">download</button>
`
})
export class AppComponent {
download() {
const docx = document.getElementById('docx');
const content = '<!DOCTYPE html><html lang="en"><body>' + docx.innerHTML + '</body></html>';
const converted = htmlDocx.asBlob(content);
saveAs(converted, 'test.docx');
}
}
Raw
docx.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-docx',
template: `
<div class="docx-container">
<h1>Hello world</h1>
<h2>h2 world</h2>
<h3>h3 world</h3>
<ul>
<li>obj 1</li>
<li>obj 2</li>
<li>obj 3</li>
</ul>
<ol>
<li><b>bold</b></li>
<li><i>italic</i></li>
<li><u>underline</u></li>
</ol>
<p>paragraph</p>
</div>
`
})
export class DocxComponent {}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment