Common

Common methods and properties

$v: Object

A place for storing any data as 'global'. For example, to transfer data between screens.
See here for more details.

Example

this.$v.myData = 12345;    
this.$v.userInfo = {id: 123, name: 'Joe'};

moment

Moment.js - a JavaScript date library for parsing, validating, manipulating, and formatting dates. See details

Example

const currYear = this.$a.moment().year();

_

Lodash is a popular JavaScript utility library that provides helpful functions to work with arrays, collections, objects, strings, and more. See details.

Example

var array = [1, 2, 3, 4];
var evens = this.$a._.remove(array, function(n) {
  return n % 2 == 0;
});
console.log(array); // => [1, 3]
console.log(evens); // => [2, 4]

path: string

The current router url, aspectRatio

lang: string

The current language that was set using setLang

offline: boolean

Is device currently offline

width: number

Current screen width

height: number

Current screen height

smUp: boolean

Is the current screen width more or equal than the SM size

smDown: boolean

Is the current screen width less than the SM size

mdUp: boolean

Is the current screen width more or equal than the MD size

mdDown: boolean

Is the current screen width less than the MD size

lgUp: boolean

Is the current screen width more or equal than the LG size

lgDown: boolean

Is the current screen width less than the LG size

xlUp: boolean

Is the current screen width more or equal than the XL size

xlDown: boolean

Is the current screen width less than the XL size

projectInfo: {description: string

guid: string
name: string}
Contains info about the current project.
See here for more details.

Example

var projectName = this.$a.projectInfo.name

FILE_FORMAT

File formats available for reading.
There are 5 formats:
{
"STRING",
"ARRAY_BUFFER",
"BLOB",
"FORM_DATA",
"DATA_URL"
}

isAndroid

isAndroid(): boolean

Returns

true if the application runs as an Android app (apk, aab) and false in other cases.

Example

if (this.$a.isAndroid()) {  
    // any actions for android app only  
}

isIOS

isIOS(): boolean

Returns

true if the application runs as an iOS app (ipa) and false in other cases.

Example

if (this.$a.isIOS()) {    
  // any actions for iOS app only  
}

isMobile

isMobile(): boolean

Returns

true if the application runs as an iOS app (ipa) or Android app (apk, aab) and false in other cases.

Example

if (this.$a.isMobile()) {    
  // any actions for mobile app only  
}

isBrowser

isBrowser(): boolean

Returns

true if the application runs in a browser and false in other cases.

Example

if (this.$a.isAndroid()) {    
  // any actions for browser app only  
}

onNetworkStateChange

onNetworkStateChange(cb: Function): void

Add callback function on network state change event. You can add as many functions as you want.

Parameters

  • cb - callback function to be invoked when network state is changed. Callback function will receive state ('offline' or 'online') as a parameter;

Example

let myFunc = (state) => {
  console.log("State is: " + state);
}
this.$a.onNetworkStateChange(myFunc)

offNetworkStateChange

offNetworkStateChange(cb: Function): void

Remove callback function on network state change event.

Parameters

  • cb - callback function to be removed from network state change event listeners. Callback function should be the same function you've added via onNetworkStateChange method

Example

let myFunc = (state) => {
  console.log("State is: " + state);
}
this.$a.onNetworkStateChange(myFunc);
//// some logic
this.$a.offNetworkStateChange(myFunc);

navigateTo

navigateTo("routeName", ...optionalParams);
Navigates to the specified route with parameters (if needed).
See here for more details.

For more advanced navigation, see the Apperyio.navigation section.

Example

this.$a.navigateTo("screen2");

getRouteParam

getRouteParam(paramName: string): any
Gets a route parameter value.
See here for more details.

Example

var id = this.$a.getRouteParam("id")

getQueryParam

getQueryParam(paramName: string): any
Gets a query parameter value.

Example

var id = this.$a.getQueryParam("id")

execDataService

execDataService(context: any, serviceName: string, callback?: Function): void
Executes DataService (service added to the DATA panel)

Example

this.$a.execDataService(this, "service_name");

getService

getService(name: string): Promise
Gets a service by the service name.

Example

this.$a.getService("service_name").then(    
  service => {  
      if (!service) {  
         console.log("Error. Service was not found.");  
        return;  
      }  
      service.execute({  
          data: {},  
          params: {},  
          headers: {}  
      }).subscribe(  
          (res: any) => {  
              console.log(res);  
          },  
          (err: any) => {  
              console.log(err)  
          }  
      )  
  }  
)

getController

getController(name: string): any
Gets the Ionic controller by its name. Available controllers are: ActionSheetController, AlertController, PickerController, MenuController, ModalController, PopoverController, LoadingController, ToastController.

Example

let controller = this.$a.getController("LoadingController");

getGSNameByImpl

getGSNameByImpl(srv: any): Promise
Gets a Generic Service name by its implementation. Used inside custom services mainly.

Example

let srvName = await this.$a.getGSNameByImpl(this);

entityAPIGet

entityAPIGet(name: string, defaults?: any, default_undefined?: boolean, skip_empty_objects?: boolean): any
Retrieves an instance of the model specified by Name.

Parameters

  • name - Name of the Model or Path to the Model part;
  • defaults - Plain object which will be merged to the instance;
  • defaultundefined - If **\true**, then any property in the generated entity will be initialized by undefined, otherwise, by type-specific empty value (0, "", false, {});
  • skipempty_objects - If **\true**, then any empty property (empty arrays and objects without properties that differs from undefined) in the generated entity will be set to undefined.

Returns

Instance of the Model/Model_part.

alert

alert(message: string, header?: string, func?: Function, options?: {cssClass?: string, subHeader?: string, backdropDismiss?: boolean, htmlAttributes?, buttons?: AlertButtons[], buttonText?: string, inputs?: AlertInput[]}): Promise;

Show Alert with specified message and header (optional). The OK button text is translated automatically (if translation is set in the current language).

Parameters

  • message - Message of the alrert;
  • header - (optional) Header of the alrert;
  • func - (optional) Function that should be called when the OK button is pressed;
  • options - (optional) Additional alert's options. Available options are:
    • cssClass - (optional) string. Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces;
    • subHeader - (optional)string. The subtitle in the heading of the alert. Displayed under the title;
    • backdropDismiss - (optional)boolean. If true, the alert will be dismissed when the backdrop is clicked. (default is true);
    • htmlAttributes - (optional) Additional attributes to pass to the alert;
    • buttons - (optional) Array of buttons to be added to the alert. If not provided then only one OK button will be shown;
    • inputs - (optional) Array of input to show in the alert;
    • buttonText - (optional) string. Text of the button. If not provided then 'Ok' text is used. Button text is translated automatically.

Returns

Promise with created alert.

Example

let alert = await this.$a.alert("Some message");
// some code
alert.dismiss(); // close alert

alertAsync

alertAsync(message: string, header?: string, options?: {cssClass?: string, subHeader?: string, backdropDismiss?: boolean, htmlAttributes?, buttons?: AlertButtons[], buttonText?: string, inputs?: AlertInput[]}): Promise;

The same as the alert method, but it returns a Promise that resolves to true or the returned data (if inputs were provided) when the alert window is closed.

Parameters

  • message - Message of the alrert;
  • header - (optional) Header of the alrert;
  • options - (optional) Additional alert's options. Available options are:
    • cssClass - (optional) string. Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces;
    • subHeader - (optional) string. The subtitle in the heading of the alert. Displayed under the title;
    • backdropDismiss - (optional) boolean. If true, the alert will be dismissed when the backdrop is clicked. (default is true);
    • htmlAttributes - (optional) Additional attributes to pass to the alert;
    • inputs - (optional) Array of input to show in the alert;
    • buttonText - (optional) string. Text of the button. If not provided then 'Ok' text is used. Button text is translated automatically.

Returns

Promise that resolves to true or the returned data (if inputs were provided) when the alert window is closed.

Example

let res = await currentScreen.$a.alertAsync("Some message");
// The code to be executed when the alert is closed.

alertOkCancel

alertOkCancel(message: string, header?: string, funcOk?: Function, funcCancel?: Function, options?: {cssClass?: string, subHeader?: string, backdropDismiss?: boolean, htmlAttributes?, inputs?: AlertInput[], okButtonText?: string, cancelButtonText?: string}): Promise;

Show Alert with OK and Cancel buttons. The text of the buttons is translated automatically (if translation is set in the current language).

Parameters

  • message - Message of the alrert;
  • header - (optional) Header of the alrert;
  • funcOk - (optional) Function that should be called when the OK button is pressed;
  • funcCancel - (optional) Function that should be called when the Cancel button is pressed;
  • options - (optional) Additional alert's options. Available options are:
    • cssClass - (optional) string. Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces;
    • subHeader - (optional)string. The subtitle in the heading of the alert. Displayed under the title;
    • backdropDismiss - (optional)boolean. If true, the alert will be dismissed when the backdrop is clicked. (default is false);
    • htmlAttributes - (optional) Additional attributes to pass to the alert;
    • inputs - (optional) Array of input to show in the alert;
    • okButtonText - (optional) string. Text of the OK button. If not provided then 'Ok' text is used. Button text is translated automatically;
    • cancelButtonText - (optional) string. Text of the CANCEL button. If not provided then 'Cancel' text is used. Button text is translated automatically.

Returns

Promise with created alert.

Example

let alert = await this.$a.alertOkCancel(  
    "Some message",  
    "Header text",  
  () => {console.log("OK was pressed")},  
    () => {console.log("Cancel was pressed")}  
);
// some code
alert.dismiss(); // close alert

alertOkCancelAsync

alertOkCancelAsync(message: string, header?: string, options?: {cssClass?: string, subHeader?: string, backdropDismiss?: boolean, htmlAttributes?, inputs?: AlertInput[], okButtonText?: string, cancelButtonText?: string}): Promise;

The same as the alert method, but it returns a Promise that resolves to true or the returned data (if inputs parameter provided) if OK button is clicked OR false when Cancel button was clicked.

Parameters

  • message - Message of the alrert;
  • header - (optional) Header of the alrert;
  • options - (optional) Additional alert's options. Available options are:
    • cssClass - (optional) string. Additional classes to apply for custom CSS. If multiple classes are provided they should be separated by spaces;
    • subHeader - (optional)string. The subtitle in the heading of the alert. Displayed under the title;
    • backdropDismiss - (optional)boolean. If true, the alert will be dismissed when the backdrop is clicked. (default is false);
    • htmlAttributes - (optional) Additional attributes to pass to the alert;
    • inputs - (optional) Array of input to show in the alert;
    • okButtonText - (optional) string. Text of the OK button. If not provided then 'Ok' text is used. Button text is translated automatically;
    • cancelButtonText - (optional) string. Text of the CANCEL button. If not provided then 'Cancel' text is used. Button text is translated automatically.

Returns

Promise with true, false or returned data.

Example

let ok = await this.$a.alertOkCancelAsync(  
  "Delete this item?"  
);
if (ok) {
  // some code when OK is clicked
} else {
  // some code when Cancel is clicked
}

closeModal

closeModal(data?: any)
Close current Modal.

Parameters

  • data - (optional) Any data to be send from Modal;

Example

this.$a.closeModal({p1: 1, p2: "Hi"});

convertBase64ToBlob

convertBase64ToBlob(base64Image: string): Blob
Convert base64 string to Blob.

convertBlobToBase64

convertBlobToBase64(blob: Blob): Promise
Convert Blob to base64 string.

Example

let blob = new Blob(['test']);
let base64str = await this.$a.convertBlobToBase64(blob);

dataURLtoBase64

dataURLtoBase64(dataURL: string);
Remove type and format from dataURL string.

Returns

String.

Example

let base64String = this.$a.dataURLtoBase64(  
    "data:image/gif;base64,R0lGO\  
DdhMAAwAPAAAAAAAP///ywAAAAAMAAwAAAC8IyPqcvt\  
3wCcDkiLc7C0qwyGHhSWpjQu5yqmCYsapyuvUUlvON\  
mOZtfzgFzByTB10QgxOR0TqBQejhRNzOfkVJ+5YiUq\  
rXF5Y5lKh/DeuNcP5yLWGsEbtLiOSpa/TPg7JpJHxy\  
endzWTBfX0cxOnKPjgBzi4diinWGdkF8kjdfnycQZX\  
ZeYGejmJlZeGl9i2icVqaNVailT6F5iJ90m6mvuTS4\  
OK05M0vDk0Q4XUtwvKOzrcd3iq9uisF81M1OIcR7lE\  
ewwcLp7tuNNkM3uNna3F2JQFo97Vriy/Xl4/f1cf5V\  
WzXyym7PHhhx4dbgYKAAA7");

dataURLtoFile

dataURLtoFile(dataURL: string, filename: string): File
Convert dataURL to File.

Example

let base64String = this.$a.dataURLtoBase64(  
    "data:image/gif;base64,R0lGO\  
DdhMAAwAPAAAAAAAP///ywAAAAAMAAwAAAC8IyPqcvt\  
3wCcDkiLc7C0qwyGHhSWpjQu5yqmCYsapyuvUUlvON\  
mOZtfzgFzByTB10QgxOR0TqBQejhRNzOfkVJ+5YiUq\  
rXF5Y5lKh/DeuNcP5yLWGsEbtLiOSpa/TPg7JpJHxy\  
endzWTBfX0cxOnKPjgBzi4diinWGdkF8kjdfnycQZX\  
ZeYGejmJlZeGl9i2icVqaNVailT6F5iJ90m6mvuTS4\  
OK05M0vDk0Q4XUtwvKOzrcd3iq9uisF81M1OIcR7lE\  
ewwcLp7tuNNkM3uNna3F2JQFo97Vriy/Xl4/f1cf5V\  
WzXyym7PHhhx4dbgYKAAA7");  
let file  = this.$a.dataURLtoFile(base64String, "file1.gif");

dismissLoading

dismissLoading(): Promise
Dismiss loading.

Returns

Promise.

Example

await this.$a.dismissLoading();

filterArray

filterArray(array: any[], condition: Function|Object|string): any[]
Filter specified array.

Parameters

  • array - Array to be filtered;
  • condition - Function OR Object OR String;

Returns

Promise.

Example

var users = [    
{ 'user': 'luv',  
  'salary': 36000,  
  'active': true },  
{ 'user': 'kush',  
  'salary': 40000,  
  'active': false }  
];  
var activeUsers = this.$a.filterArray(users, {active: true});

generatePassword

generatePassword(len?: number): string
Generate strong password with specified length.

Parameters

  • len - (optional) password length (Default is 10);

Returns

String.

Example

let pass = this.$a.generatePassword();

generateUUID

generateUUID(): string
Generate UUID in format:
xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx

Returns

String.

Example

let uuid = this.$a.generateUUID();

getConfig

getConfig(configName: string, scope?: string)
Get value from config asset.

Parameters

  • configName - name of the config parameter;
  • scope - (optional) name of the config asset ('Settings' by default);

Example

let dbId = this.$a.getConfig("dbId");

getLang

getLang(): string
Get the current language that was set using setLang

Example

let lang = this.$a.getLang();

getLocal

getLocal(name: string)
Get value from local storage.
See setLocal for details.

Example

let userData = this.$a.getLocal("user");

getMediaTypeFromDataURL

getMediaTypeFromDataURL(dataURL: string): string
Get media type from dataURL.

Example

let base64String = this.$a.dataURLtoBase64(  
    "data:image/gif;base64,R0lGO\  
DdhMAAwAPAAAAAAAP///ywAAAAAMAAwAAAC8IyPqcvt\  
3wCcDkiLc7C0qwyGHhSWpjQu5yqmCYsapyuvUUlvON\  
mOZtfzgFzByTB10QgxOR0TqBQejhRNzOfkVJ+5YiUq\  
rXF5Y5lKh/DeuNcP5yLWGsEbtLiOSpa/TPg7JpJHxy\  
endzWTBfX0cxOnKPjgBzi4diinWGdkF8kjdfnycQZX\  
ZeYGejmJlZeGl9i2icVqaNVailT6F5iJ90m6mvuTS4\  
OK05M0vDk0Q4XUtwvKOzrcd3iq9uisF81M1OIcR7lE\  
ewwcLp7tuNNkM3uNna3F2JQFo97Vriy/Xl4/f1cf5V\  
WzXyym7PHhhx4dbgYKAAA7");  
let type = this.$a.getMediaTypeFromDataURL(base64String
);

getSession

getSession(name: string)
Get value from session storage.

Example

let userData = this.$a.getSession("user");

getStorage

getStorage(name: string): Promise
Get from storage.
Shortening for this.$a.data.getStorage;

Example

let val = await this.$a.getStorage("storName");

getValueFromObject

getValueFromObject(obj, properties?: string[], notNull?: boolean)
Get first non-empty property from object.

Parameters

  • obj - object;
  • properties - (optional) names of the properties (Default is ['description', 'message', 'error'] );
  • notNull - (optional) return only not empty value (not empty string, not null, not undefined) (Default is true );

Example

let id = this.$a.getValueFromObject(  
    {id: 123, name: "Joe"},  
    ["guid", "_id", "id"]  
);

getVariable

getVariable(varName: string): any
Get a variable.
Shortening for this.$a.data.getVariable;

Example

let val = this.$a.getVariable("storName");

hasRole

hasRole(...roles): boolean
Check if the role set using setRole is present in the list of provided roles.

Returns

Boolean.

Example

let hasAdminRole = this.$a.hasRole("admin", "superAdmin");

hasString

hasString(source: string[]|string, str: string, caseSensitive?: boolean): boolean
Check if string or array of strings has provided substring.

Parameters

  • source - string or array of strings;
  • str - (optional) names of the properties (['description', 'message', 'error'] by default)
  • caseSensitive - (optional) use case-sensitive comparison (false by default);

Returns

Boolean.

Example

const greetings = ["Welcome to USA", "Welcome to EU"];   
let hasUSA= this.$a.hasString(greetings, "USA");

hasValue

hasValue(source: any, value?: any): boolean
Check if an object or an array has provided value.

Parameters

  • source - object or array;
  • value - (optional) some value that we will be searching for (any not undefined or null by default);

Returns

Boolean.

Example

const options = {opt1: false, opt2: false, opt3: true}   
let hasTrue= this.$a.hasValue(options, true);

hexToRGB

hexToRGB(hex: string, alpha?: number): string
Convert hex color to RGB color.

Parameters

  • hex - hex color;
  • alpha - (optional) alpha;

Returns

String.

Example

let rgb = this.$a.hexToRGB("#12FF00");

isDataURL

isDataURL(dataURL: string): boolean
Check if provided string is a dataURL

loadScript

loadScript(src: string, isModule?: boolean): Promse
Add external JS script to the html page.

Parameters

  • src - script url;
  • isModule - (optional) set to true if loading a JS module.

Example

await this.$a.loadScript("https://......");  
console.log("script is loaded")

markFormAsTouched

markFormAsTouched(form, markAllAsTouched?: boolean): boolean
Mark form as touched or just check if form is invalid (if second parameter is false)

Parameters

  • form - form on the screen;
  • markAllAsTouched - (optional) mark form as touched or not (true by default);

Returns

Boolean - form's invalid status.

Example

let isInvalid = this.$a.markFormAsTouched(this.form1);

modal

modal(screenName: string, componentProps?, options?): Promise
Shows a modal page with a specified screen name. The screen should be marked as a Modal screen in thePROPERTIES panel.
See here for more details.

Parameters

  • screenName - name of the screen;
  • componentProps - (optional) values for screen variables;
  • options - (optional) object with modal options (showBackdrop, backdropDismiss, cssClass, animated, keyboardClose);

Returns

Promise with data returned from modal (see closeModal method).

Example

let data = await this.$a.modal("EditUser", {user: this.user});

readFile

readFile(file, format?: FILE_FORMAT, type?: string, name?: string): Promise
Read Blob or File in specified format.

Parameters

  • file - Blob or File;
  • format - (optional) FILE_FORMAT (see details for FILE_FORMAT property). Default is DATA_URL;
  • type - (optional) Mime type (in case of BLOB and FORM_DATA format);
  • name - (optional) File name (in case of FORM_DATA format)

Example

let fileData = await this.$a.readFile(this.fileInput, this.$a.FILE_FORMAT.STRING);

removeFromArray

removeFromArray(array: any[], ...items): any[]
Remove items from array.
Items will be removed from original array.

Returns

Clone of the original array.

Example

let arr = [1,2,3,4,5];  
this.$a.removeFromArray(arr, 1,2,5);

removeStorage

removeStorage(name: string): Promise
Removes from storage.
Shortening for this.$a.data.removeStorage

Example

await this.$a.removeStorage("storName");

replaceObject

replaceObject(origin, source)
Remove all properties from origin object and add to origin object all properties from source object.

resizeImage

resizeImage(base64image: string, options?: {width?: number; height?: number; maxSize?: number, aspectRatio?: boolean}): Promise
Resize image in Base64 format. Resized image has image/jpeg format.

Parameters

  • base64image - dataURL or just base64 encoded image data;
  • options - (optional) width, height, aspectRatio (defaults to true) and maxSize (defaults to 409600 bytes);

Returns

Promise with dataURL of resized image.

Example

let src = this.$a.dataURLtoBase64(  
    "data:image/gif;base64,R0lGO\  
DdhMAAwAPAAAAAAAP///ywAAAAAMAAwAAAC8IyPqcvt\  
3wCcDkiLc7C0qwyGHhSWpjQu5yqmCYsapyuvUUlvON\  
mOZtfzgFzByTB10QgxOR0TqBQejhRNzOfkVJ+5YiUq\  
rXF5Y5lKh/DeuNcP5yLWGsEbtLiOSpa/TPg7JpJHxy\  
endzWTBfX0cxOnKPjgBzi4diinWGdkF8kjdfnycQZX\  
ZeYGejmJlZeGl9i2icVqaNVailT6F5iJ90m6mvuTS4\  
OK05M0vDk0Q4XUtwvKOzrcd3iq9uisF81M1OIcR7lE\  
ewwcLp7tuNNkM3uNna3F2JQFo97Vriy/Xl4/f1cf5V\  
WzXyym7PHhhx4dbgYKAAA7");  
src = await this.$a.resizeImage(src, {width: 300, height: 300});

scrollBottom

scrollBottom(target, options?: {duration?: number, timeout?: number}): void
Scroll target element to the bottom.

Parameters

  • target - screen component or any html component on the screen;
  • options - (optional) object with duration (defaults to 300 ms) and timeout (defaults to 300 ms);

Example

this.$a.scrollBottom(this);

scrollTop

scrollTop(target, options?: {duration?: number, timeout?: number}): void
Scroll target element to the top.

Parameters

  • target - screen component or any html component on the screen;
  • options - (optional) object with duration (defaults to 300 ms) and timeout (defaults to 300 ms);

Example

this.$a.scrollTop(this);

service

service(name: string, data? , options?): Promise
Call service.

Parameters

  • name - service asset name;
  • data - (optional) service parameters;
  • options - (optional). Available options are:
    • loadingStart - show loading on service execution start (default is false);
    • loadingEnd - hide loading on service execution end (default is false);
    • loading - boolean. Shortening for (loadingStart = true and loadingEnd = true);
    • showError - show toast with error if error occurs (default is true);
    • message - message to be shown after success service execution;
    • errorMessage - message to be shown after error in service execution;
    • throwError - throw error if service execution ends with error;
    • cache - take result from cache if possible;
    • saveInCache - save result to cache.

Returns

Promise with service execution result.

Example

let user = await this.$a.service("getUserData", {    
  /* body */  
  data: {userId: 123},  
  /* query params */  
  params: {query_param: "qp1"},  
  /* headers */  
    headers: {some_header: "some-header-value"}  
});

setLang

setLang(lang: string)
Changes the lang currently used.
Shortening for this.$a.translate.use

Example

this.$a.setLang("en");

setLocal

setLocal(name: string, value)
Set value to local storage.

Example

this.$a.setLocal("user", {userId: 123, userName: "Joe"});

setRole

setRole(role): void
Set some role for current user.
See hasRole for details.

Example

this.$a.setRole("admin"});

setSession

setSession(name: string, value)
Set value to session storage.

Example

this.$a.setSession("user", {userId: 123, userName: "Joe"});

setStorage

setStorage(name: string, value): Promise
Get from storage.
Shortening for this.$a.data.setStorage;

Example

await this.$a.setStorage("storName", {userId: 123, userName: "Joe"});

setTheme

setTheme(theme: string)
Sets a theme.
Shortening for this.$a.theme.set

Example

this.$a.setTheme("dark");

showError

showError(e): Promise
Show alert with message.
This method dismisses loading if it was present.

Parameters

  • e - string or object with message in 'description', 'message' or 'error' property;

Returns

Promise with created alert.

Example

let errorAlert = await this.$a.showError("Please try again later");
// some code
errorAlert.dismiss(); // close error alert

showLoading

showLoading(message?: string, spinner?: string): Promise
Show loading.
Message text is translated automatically (if translation is set in the current language).

Parameters

  • message - (optional) loading message (default is 'Please wait...');
  • spinner - (optional) spinner type. One of: "bubbles" | "circles" | "circular" | "crescent" | "dots" | "lines" | "lines-sharp" | "lines-sharp-small" | "lines-small" (default is "crescent")

Returns

Promise with created loading.

Example

let loading = await this.$a.showLoading();
// some code
loading.dismiss(); // close loading

toast

toast(message: string, header?: string, options?: {color?: string, position?: string, duration?: number, buttons?: ToastButton[]}): Promise
Show toast.
Message and Header are translated automatically (if translation is set in the current language).

Parameters

  • message - toast message;
  • header - (optional) toast header
  • options - (optional)available options are:
    • color - (optional) "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark" or your custom color name defined in theme (default is "success");
    • position - (optional) one of "bottom" | "middle" | "top" (default is "bottom");
    • duration - (optional) How many milliseconds to wait before hiding the toast (default is 1000) ;
    • buttons - array of ToastButtons
    interface ToastButton {  
        text?: string;  
        icon?: string;  
        side?: 'start' | 'end';  
        role?: 'cancel' | string;  
        cssClass?: string | string\[];  
        htmlAttributes?: { [key: string]\: any };  
        handler?: () => boolean | void | Promise\<boolean | void>;  
      }
    

Returns

Promise with created toast.

Example

let toast = await this.$a.toast("Hi, Joe");
// some code
toast.dismiss(); // close toast

timeout

timeout(ms: number): Promise
Timeout that triggers after the specified time. Convenient for delaying some action (such as retrying a REST request, etc.).

Parameters

  • ms - number. Time in milliseconds;

Returns

Promise.

Example

// await 3 seconds
await this.$a.timeout(3000);

toPromise

toPromise(func, options): Promise
Convert function call with callbacks to Promise.

Parameters

  • func - function to be called;
  • options - object with options OR parameters that should precede the callback functions when the function is called. Available options are:
    • beginParameters - (optional) an array of parameters that should precede the callback functions when the function is called;
    • endParameters - (optional) an array of parameters that should follow the callback functions when the function is called.;
    • errorFirst - (optional) if true, in the function parameters list, the error callback comes before the success callback. By default, it's set to false (meaning, by default, the success callback comes before the error callback).;
    • onlySuccess - (optional) set this parameter to true if the callback function has only a success callback;
    • alwaysResolve - (optional) boolean. If true, call resolve in case of an error.

Returns

Promise.

Example

// the usual usage of the Cordova plugin
 window.cordova.plugins.ThemeDetection.isDarkModeEnabled(
   function(success) {
     // code here
   },
   function(error) {
     // code here
   }
 );

// Using the Cordova plugin with the toPromise method
let value = await this.$a.toPromise(window.cordova?.plugins?.ThemeDetection?.isDarkModeEnabled)

Uint8ToBase64

Uint8ToBase64(u8Arr)
Convert Uint8 array buffer to base64 string

updateApp

updateApp(message?: string): Promise
Update application if new version is available. Will work only with Hot Code Push Plugin enabled.

Parameters

  • message - (optional) message for loading.

Example

await this.$a.updateApp();

showModal

showModal(screenName: string, options?: any): Promise
Shows a modal page with a specified screen name. The screen should be marked as a Modal screen in thePROPERTIES panel.
See here for more details.

There is a simpler method for opening a modal window. See the modal method.

Example

this.$a.showModal("screenName", {    
      componentProps: {},  
      showBackdrop: true,  
      backdropDismiss: true,  
      cssClass: "",  
      animated: true,  
      keyboardClose: true  
  })  
   .then(modal => {  
      modal.present();  
      modal.onDidDismiss().then((dataReturned) => {  
          // console.log(dataReturned.data);  
      });  
    });

HTTP Methods

addHeaders

addHeaders(headers: {[key:string]: string}): void;
Add headers to default list of headers.

Parameters

  • headers - object with new headers.

Example

this.$a.addHeaders({  
"Content-Type": "application/json"  
});

delete

delete(url: string, options?): Promise
DELETE http request.

Parameters

  • url - request url
  • options - (optional). Available options are:
    • headers - object with new headers;
    • params - object with query parameters;
    • returnError - boolean. In case of error return error instead of undefined (default is false);
    • useProxy - boolean. If set to true, the request will be proxied through the Appery.io backend (default is false);
    • responseType - string. The expected response type of the server. One of: "json", "arraybuffer", "blob", "text". Default is "json";
    • withCredentials - boolean. Wether this request should be sent with outgoing credentials (cookies) (default is false);
    • clearContentType - boolean. If true - 'Content-Type' header will be deleted;
    • noExtend - boolean. If true - default headers will not be extended and only headers from options will be used;
    • loadingStart - show loading on service execution start (default is false);
    • loadingEnd - hide loading on service execution end (default is false);
    • loading - boolean. Shortening for (loadingStart = true and loadingEnd = true);
    • showError - show toast with error if error occurs (default is true);
    • message - message to be shown after success service execution;
    • errorMessage - message to be shown after error in service execution;
    • throwError - throw error if service execution ends with error;

Returns

Promise with request execution result.

Example

let res = await this.$a.delete("https://mydomain.com/user/12345");  
console.log(res);

get

get(url: string, options?): Promise
GET http request.

Parameters

  • url - request url
  • options - (optional). Available options are:
    • headers - object with new headers;
    • params - object with query parameters;
    • returnError - boolean. In case of error return error instead of undefined (default is false);
    • useProxy - boolean. If set to true, the request will be proxied through the Appery.io backend (default is false);
    • responseType - string. The expected response type of the server. One of: "json", "arraybuffer", "blob", "text". Default is "json";
    • withCredentials - boolean. Wether this request should be sent with outgoing credentials (cookies) (default is false);
    • clearContentType - boolean. If true - 'Content-Type' header will be deleted;
    • noExtend - boolean. If true - default headers will not be extended and only headers from options will be used;
    • loadingStart - show loading on service execution start (default is false);
    • loadingEnd - hide loading on service execution end (default is false);
    • loading - boolean. Shortening for (loadingStart = true and loadingEnd = true);
    • showError - show toast with error if error occurs (default is true);
    • message - message to be shown after success service execution;
    • errorMessage - message to be shown after error in service execution;
    • throwError - throw error if service execution ends with error;
    • cache - take result from cache if possible;
    • saveInCache - save result to cache.

Returns

Promise with request execution result.

Example

let res = await this.$a.get("https://mydomain.com/user/12345");  
console.log(res);

getApiUrl

getApiUrl(url: string): string
Add api host (default or set via setHost) to the provided relative url.

Parameters

  • url - relative url.

Example

let url = this.$a.getApiUrl("/user/update");

getHeaders

getHeaders(options?: {headers: any, clearContentType?: boolean, noExtend?: boolean}): {headers: HttpHeaders}
Get current headers as HttpHeaders.

Parameters

  • options - (optional). Available options are:
    • headers - object with new headers;
    • clearContentType - boolean. If true - 'Content-Type' header will be deleted;
    • noExtend - boolean. If true - default headers will not be extended and only headers from options will be used.

getHost

getHost(): string
Returns current API host (default or set via setHost).

Returns

String. Current API host.

Example

let host = this.$a.getHost();

post

post(url: string, body, options?): Promise
POST http request.

Parameters

  • url - request url;
  • body - request body;
  • options - (optional). Available options are:
    • headers - object with new headers;
    • params - object with query parameters;
    • returnError - boolean. In case of error return error instead of undefined (default is false);
    • useProxy - boolean. If set to true, the request will be proxied through the Appery.io backend (default is false);
    • responseType - string. The expected response type of the server. One of: "json", "arraybuffer", "blob", "text". Default is "json";
    • withCredentials - boolean. Wether this request should be sent with outgoing credentials (cookies) (default is false);
    • clearContentType - boolean. If true - 'Content-Type' header will be deleted;
    • noExtend - boolean. If true - default headers will not be extended and only headers from options will be used;
    • loadingStart - show loading on service execution start (default is false);
    • loadingEnd - hide loading on service execution end (default is false);
    • loading - boolean. Shortening for (loadingStart = true and loadingEnd = true);
    • showError - show toast with error if error occurs (default is true);
    • message - message to be shown after success service execution;
    • errorMessage - message to be shown after error in service execution;
    • throwError - throw error if service execution ends with error.

Returns

Promise with request execution result.

Example

let res = await this.$a.post("https://mydomain.com/user/12345", {name: "Joe", age: 20});  
console.log(res);

put

put(url: string, body, options?): Promise;
PUT http request.

Parameters

  • url - request url;
  • body - request body;
  • options - (optional). Available options are:
    • headers - object with new headers;
    • params - object with query parameters;
    • returnError - boolean. In case of error return error instead of undefined (default is false);
    • useProxy - boolean. If set to true, the request will be proxied through the Appery.io backend (default is false);
    • responseType - string. The expected response type of the server. One of: "json", "arraybuffer", "blob", "text". Default is "json";
    • withCredentials - boolean. Wether this request should be sent with outgoing credentials (cookies) (default is false);
    • clearContentType - boolean. If true - 'Content-Type' header will be deleted;
    • noExtend - boolean. If true - default headers will not be extended and only headers from options will be used;
    • loadingStart - show loading on service execution start (default is false);
    • loadingEnd - hide loading on service execution end (default is false);
    • loading - boolean. Shortening for (loadingStart = true and loadingEnd = true);
    • showError - show toast with error if error occurs (default is true);
    • message - message to be shown after success service execution;
    • errorMessage - message to be shown after error in service execution;
    • throwError - throw error if service execution ends with error.

Returns

Promise with request execution result.

Example

let res = await this.$a.put("https://mydomain.com/user/12345", {name: "Joe", age: 20});  
console.log(res);

saveFile

saveFile(data: Blob|string, fileName: string): void
Save Blob or Base64 encoded file as a file.

Parameters

  • data - Blob or Base64 encoded file;
  • fileName - file name.

saveTextFile

saveTextFile(text: string, fileName: string): void
Save string as a text file.

Parameters

  • text - string;
  • fileName - file name.

sc

sc(scriptName: string, body?, options?): Promise
Execute server code script.

Parameters

  • scriptName - script name;
  • body - (optional). request body (default is empty object {});
  • options - (optional). Available options are:
    • headers - object with new headers;
    • clearContentType - boolean. If true - 'Content-Type' header will be deleted;
    • noExtend - boolean. If true - default headers will not be extended and only headers from options will be used;
    • loadingStart - show loading on service execution start (default is false);
    • loadingEnd - hide loading on service execution end (default is false);
    • loading - boolean. Shortening for (loadingStart = true and loadingEnd = true);
    • showError - show toast with error if error occurs (default is true);
    • message - message to be shown after success service execution;
    • errorMessage - message to be shown after error in service execution;
    • throwError - throw error if service execution ends with error.

setHeaders

setHeaders(headers: {[key:string]: string}): void
Set default list of headers.

Parameters

  • headers - object with headers.

Example

this.$a.setHeaders({  
"Content-Type": "application/json"  
});

setHost

setHost(host: string): void
Default API host is "https://api.appery.io"
You can set your own default API host.

Parameters

  • host - default host.

Example

this.$a.setHost("https://mydomain.com");

setProxy

setProxy(proxyId: string): void
Set Appery.io ProxyID for all requests with useProxy: true option.

You don't need to set any proxy ID. By default, your account's default proxy is used. You can also specify which proxy to use by setting the proxyId property in the Settings service. The setProxy method allows you to change the proxy used at any time. For example, you can connect a secure proxy for specific requests.

Parameters

  • proxyId - proxy ID.

Example

this.$a.setProxy("f81040b2-6e84-4846-b259-123456789012");

Secure storage

Secure Storage only works in native applications (apk/aab, ipa). It is not possible to implement Secure Storage in the Web version, so a placeholder is used exclusively for testing the application. Do not use Secure Storage in the production version of the Web application.

ssGet

ssGet(key: string): Promise<any | null>
Get value from secure storage.

Parameters

  • key - value key

Example

this.$a.ssGet("password");

ssRemove

ssRemove(key: string): Promise
Remove value from secure storage

Parameters

  • key - value key

Example

this.$a.ssRemove("password");

ssSet

ssSet(key: string, value: any): Promise
Set value to secure storage.

Parameters

  • key - value key
  • value - any value to store in secure storage

Example

this.$a.ssSet("password", "123");