https://github.com/it-era/ngx-safe-pipes

This library provide convenient pipes to bypass Angular built-in sanitization.
https://github.com/it-era/ngx-safe-pipes

angular angular7 bypass helpers library ngx pipes sanitization

Last synced: 5 months ago
JSON representation

This library provide convenient pipes to bypass Angular built-in sanitization.

• Host: GitHub
• URL: https://github.com/it-era/ngx-safe-pipes
• Owner: it-era
• Created: 2019-06-04T02:47:58.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2021-11-10T12:25:18.000Z (over 4 years ago)
• Last Synced: 2025-11-23T08:11:54.082Z (8 months ago)
• Topics: angular, angular7, bypass, helpers, library, ngx, pipes, sanitization
• Language: TypeScript
• Size: 22.5 KB
• Stars: 3
• Watchers: 0
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

          
# IT-era / NgxSafePipes

This library provide convenient pipes to bypass Angular built-in sanitization and get rid off the `unsafe value used in a ... context`.

This package is a part of the [IT-era/ngx](https://github.com/it-era/ngx) packages suite.

[![GitHub](https://badgen.net/github/tag/it-era/ngx-safe-pipes?color=green)](https://github.com/it-era/ngx-safe-pipes)

[![Npm](https://badgen.net/npm/v/@it-era%2Fngx-safe-pipes?color=green)](https://www.npmjs.com/package/@it-era/ngx-safe-pipes)

[![Bundle size](https://badgen.net/bundlephobia/minzip/@it-era/ngx-safe-pipes?color=green)](https://bundlephobia.com/result?p=@it-era/ngx-safe-pipes)

## Installation

[![npm](https://nodei.co/npm/@it-era/ngx-safe-pipes.png?mini=true)](https://www.npmjs.com/package/@it-era/ngx-safe-pipes)

This package is available through the [npm registry](https://www.npmjs.com/package/@it-era/ngx-safe-pipes) :

```sh

npm i @it-era/ngx-safe-pipes

```

Then add the `NgxSafePipesModule` into the imports array of your module (containing the template to fix) :

```ts

import { NgxSafePipesModule } from '@it-era/ngx-safe-pipes'

@NgModule({

  imports: [

    NgxSafePipesModule,

    // ...

  ],

})

export class YourModule {}

```

## List of pipes

CAUTION: Calling thoses methods with untrusted user data exposes your application to [XSS security risks](https://angular.io/guide/security#xss)!

### SafeHtml

Usage :

```HTML



```


### SafeUrl

Usage :

```HTML



```

NB: Usefull also for base64 images.

### SafeResourceUrl

Usage :

```HTML

```

### SafeScript

Usage :

```HTML

```

### SafeStyle

Usage :

```HTML



```


### Safe

Alternatively, you could use the generic SafePipe with the following syntax:

```HTML

 


 


 

 

 

```


## Changelog

You can find it [here](https://github.com/it-era/ngx-safe-pipes/blob/master/CHANGELOG.md).