🚧

Important Note!

Note that the option of creating new apps with the Ionic and Bootstrap frameworks was removed but we still support the projects that were created with them earlier.

Tutorials

If you are new to Ionic and Appery.io, try the following tutorials:

• Building Your First Ionic App.
• Building a Native App with Ionic, AngularJS, and Appery.io.
• First Ionic app with a backend. This database tutorial shows how to build an Ionic app with Appery.io database.

Solutions

Small apps that show Ionic and AngularJS features and how-tos.

Passing Data between Pages

The Hello World sample app shows how to pass data between pages/scopes using AngularJS Service. To try the app:

1. From a new or existing Ionic app, click CREATE NEW > From Plugin, select Hello World App.
2. On the next wizard screen, select page1 for Default routing.
3. Then for Index screen, select the second option: Use index page index_Hello_World_App. Click Apply Settings button to finish the import.

• Note: in an existing app this will replace the index screen with the index screen for the plugin. The original index screen will be removed.

4. Now click the Test button to launch the app in the browser and test it.

Passing Data to Modal Screen

The following code snippet shows how to pass data to a Modal screen.

Apperyio.get('Modals').loadModal("MyModal").then(
    function(modalInstance) {
        modalInstance.open(modalOptions).then(function(modal) {
            modal.scope.modal = modal;
            modal.scope.myData = myData;
            modal.show();
        });
        $scope.modal = modalInstance;
    },
    function(error){
        console.log(error);
    });

Inside the Modal screen, you will have access to the myData variable.

Adding reCAPTCHA

Read: How to Add reCAPTCHA to an Ionic App

Internationalisation In AngularJS Apps

Internationalisation In AngularJS Apps With Angular Translate.

Videos

Our YouTube Ionic/AngularJS/Cordova playlist has many short videos on how to build apps.