docs
angular
Pipes
Safe

SafePipe

standalone: true

O SafePipe ajuda a contornar a verificação de segurança do Angular para valores considerados inseguros, como HTML, estilos, scripts, URLs e URLs de recursos. Este pipe utiliza o serviço DomSanitizer do Angular para marcar os valores como seguros e permitir sua utilização no aplicativo sem causar erros de segurança.

Uso

Importe o SafePipe, adicione o pipe safe no seu template, passando o tipo de valor que deseja contornar a verificação de segurança.

.component.ts
import { SafePipe } from "@burand/angular";
.component.html
<!-- HTML -->
<div [innerHTML]="unsafeHtml | safe:'html'"></div>
 
<!-- Style -->
<div [ngStyle]="{'background-image': unsafeStyle | safe:'style'}"></div>
 
<!-- Script -->
<script [src]="unsafeScript | safe:'script'"></script>
 
<!-- URL -->
<a [href]="unsafeUrl | safe:'url'">Link</a>
 
<!-- Resource URL -->
<iframe [src]="unsafeResourceUrl | safe:'resourceUrl'"></iframe>

Aviso de segurança

Tenha cuidado ao utilizar este pipe, pois ele permite contornar a verificação de segurança do Angular. Use-o apenas quando tiver certeza de que o conteúdo é seguro e não apresenta riscos de ataques de cross-site scripting (XSS) ou outros tipos de vulnerabilidades.