trust-html-pipe

1. Description
2. Installation
3. Usage
4. Methods
5. Git repository
6. Build
7. Publish to npm
8. Version

1. Description

trust-html-pipe or TrustHtmlPipe is a pipe for angular2 projects which allows you to inject the HTML content into your templates.

2. Installation

Install the module into your application and save it as a dev dependency in your package.json file

npm install trust-html-pipe --save-dev

3. Usage

In order to use the TrustHtmlPipe you have to include/import the TrustHtmlModule into your application:

import {TrustHtmlModule} from 'trust-html-pipe';

@NgModule({
  //...
  imports: [
    //...
    TrustHtmlModule
  ],
  //...
})

Or you can include the pipe directly in your components declarations list in your @NgModule(...):

import {TrustHtmlPipe} from "trust-html-pipe";

@NgModule({
  //...
  declarations: [TrustHtmlPipe],
  //...
})

Use it in your template to "inject" trusted HTML content:

<div [innerHTML]="'<strong>test html content</strong>' | trustHtml"></div>

Output:

<div>
  <strong>test html content</strong>
</div>

4. Methods

transform(htmlString: string): any

Bypass security and trust the given value to be safe HTML. The sanitizer will leave safe HTML intact.
WARNING: in Angular version 2.x, calling this method with untrusted user data exposes your application to XSS security risks!

Parameters:
htmlString - HTML string which should not be escaped.

Return:
Method returns the intact HTML string.

5. Git repository

https://github.com/tvicpe/trust-html-pipe

6. Build

To build the final package run this command:

ng build trust-html

The build process will generate the packed sources into the dist folder.

7. Publish to npm

To publish the new version to npm, go into the dist folder:

cd ./dist/trust-html

and publish it to npm:

npm publish

8. Version

1.0.0