Defines CustomAction action component.
This component helps you writing your own processing code.
To edit code, double click the CustomAction. You are free to code in TypeScript any custom processing you want. Be sure to write your code between the/*Begin_c8o_function */
/*End_c8o_function */
delimiters.
Custom actions can be inserted in an Event processing chain, combined with any other Actions. For example, you could have a Camera Action called when the user clicks on a button an you would like to process this action’s output. To do this, place a CustomAction under the Camera action. This way, the CustomAction will be called after the Camera has finished (when the user clicks on ok to save the image…).
When you finish processing in your CustomAction, you can call resolve(data)
to pass control to the next CustomAction in the chain. The data
object will be seen a the parent.out
or stack["ActionName"].out
object you can configure in the (TS) source of the next action in the chain.You can also call reject(err)
to signal an error in the Custom Action processing. In this case, the Failure Handler or Error Handler error handler will be called.
You can pass Variables to any action. To do so, simply add Variable components under the CustomAction. You are free to associate the variable to any fixed text (TX) , TypeScript expression (TS), source (SC) and the value will be transmitted to the action.
You can access the variables value in your custom action code by using :
vars.myVariable
(where myVariable is the variable name)
You can call from CustomAction code any additional package available on NPM. To do so, simply configure the Application packages property with a NPM Package and version number, and configure the Page Imports property to declare all the packages import you will need. This will automatically insert TypeScript ‘Import’ statements in the page where the CustomAction is used. If you want to use use one the imported classes, you may have to get an Instance of it. To do so, you can use the CAF utility method this.getInstance(Class)
.
Some NPM packages may require also additional module declarations. To do so, configure the Application modules property, the Application providers property and the Application imports property. This will insert automatically the module to the app.module.ts file in the @NgModule ‘imports’ or ‘provider’ arrays, and add an ‘Import’ TypeScript statement in the file header.
Some other NPM packages may also require an Additional Cordova plugin. (For example ionic Native packages). You can also declare these plugins in the Application plugins property. This will cause Convertigo Studio to automatically add the plugin to the project’s Cordova Config.xml file.
CustomActions are also a great way to add some additional NPM packages to your projects, even if you do not write some code in the CustomAction itself, but in any other place (Page class, (TS) mode binding…)
Name | Description |
---|---|
Comment | Describes the object comment to include in the documentation report. This property generally contains an explanation about the object. |
Is active | Defines whether the component is active. |
Application assets | Defines the assets needed by this action. Add here any additional json to be inserted in the app:architect:build:option:assets[] of angular.json (Ex {“glob”: “*/”, “input”: “node_modules/tinymce”, “output”: “/tinymce/”}) |
Application imports | Defines the imports needed by this action. Add here any ‘Import’ statements needed in the app.module.ts |
Application modules | Defines the modules needed by this action. Add here any application module to be inserted in the @NgModule({Imports[]}) in app.module.ts |
Application packages | Defines the packages needed by this action. Add here any NPM Package needed by you code. They will be automatically added to the app’s Packages.json |
Application plugins | Defines the plugins needed by this action. Add here any additional Cordova plugin your code needs (Ex ion native Packages). |
Application providers | Defines the providers needed by this action. Add here any application module to be inserted in the @NgModule({Providers[]}) in app.module.ts |
Application scripts | Defines the scripts needed by this action. Add here any additional path to script file needed by your code |
Application styles | Defines the styles needed by this action. Add here any additional path to scss file needed by your code |
Page imports | Defines the imports needed by this action. Add here any ‘Import’ statements your code would require to compile. |