@nativescript/ionic-portals

https://ionic.io/docs/portals

Ionic Portals are supercharged native WebView components for iOS and Android that let you add web-based experiences to native mobile apps.

npm install @nativescript/ionic-portals

Usage

Register and create portals on app boot - Get a Portal API Key here:

import { Application } from '@nativescript/core';
import { IonicPortalManager } from '@nativescript/ionic-portals';

Application.on(Application.launchEvent, () => {
    // Register IonicPortals
    IonicPortalManager.register('<portal-api-key>');

    // Create as many Portals as you need to use in your app
    // By default, the app will look for folders equal to the portal id you use here
    // For iOS: App_Resources/iOS/webPortal
    // For Android: App_Resources/Android/src/main/asssets/webPortal 
    IonicPortalManager.create('webPortal');
});

// boot app here, for example:
Application.run({ moduleName: 'app-root' });

Use in your views

Vanilla/Plain/Core

<Page xmlns="http://schemas.nativescript.org/tns.xsd"
  xmlns:ionic="@nativescript/ionic-portals">
  <StackLayout class="p-20">
    <ionic:IonicPortal id="webPortal">
    </ionic:IonicPortal>
  </StackLayout>
</Page>

Angular

import { registerElement } from '@nativescript/angular';
import { IonicPortal } from '@nativescript/ionic-portals';
registerElement('IonicPortal', () => IonicPortal);

// use in any component:
<IonicPortal id="webPortal"></IonicPortal>

API

IonicPortalManager.register(apiKey: string): Register Portals when your app boots
- https://ionic.io/docs/portals/getting-started/guide#configure
IonicPortalManager.create(portalId: string, startDir?: string): Create a Portal
- portalId: The portal id to register
- startDir: Set the web applications directory. By default it will look for a folder named the same as the portalId as the location of the web assets. Use this optional 2nd arg if you would like the folder name to be different that the portalId.

License

Apache License Version 2.0

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!