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
andloadingEnd = 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
andloadingEnd = 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
andloadingEnd = 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
andloadingEnd = 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
andloadingEnd = 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
andloadingEnd = 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");