ZoomableFrame Component synced with Web Awesome 3.7.0

WaZoomableFrameDirective binds iframe content and zoom controls to Web Awesome's zoomable frame.

Overview

`src`, `srcdoc`, `loading`, `referrerpolicy`, `sandbox`, `allowfullscreen`, `zoom`, `zoomLevels`, `withoutControls`, `withoutInteraction`, and `withThemeSync` retain their existing meanings. Web Awesome 3.14 adds `allow` for iframe Permissions Policy, `name` for link and form targets, and `label` for an accessible iframe name. Set `allow` and `sandbox` before the frame loads; updates affect the next navigation.

Import

Import the zoomableFrame directive from the angular-awesome package:

// Import the zoomableFrame directive
import { WaZoomableFrameDirective } from 'angular-awesome/zoomable-frame';

Examples

Zoomable Frame examples

<wa-zoomable-frame
  src="/documents/preview.html"
  label="Document preview"
  name="preview"
  allow="fullscreen"
  sandbox="allow-scripts allow-same-origin"
  (load)="onPreviewLoaded()">
</wa-zoomable-frame>

API Reference

Styling