Ionic 2 components (Part 1)

Let's learn some of the useful components in ionic 2. "Action sheet" - Action sheets are nothing but a dialog in which the user can choose from a set of options. It is normally shown as a popup above the page. This action sheet contains an array of buttons with properties such as

Sample Code:

A pull down effect (pull-to-refresh functionality) to load asynchronous data in ionic 2.

We are going to use "ion-refresher" which comes by default in Ionic. This can be achieved by adding the "ion-refresher" as a child to the "ion-content" HTML. Create a callback function for "ionRefresh" at the respective typescript file. The pulling icon and the spinner is provided by default at the refresher.

Theme Ionic 2 Application - Customize and modify default theme layer of ionic application

Ionic is built on top of Sass, which allows us to set some default styles. SASS is nothing but a "CSS preprocessor" which is a scripting language that extends CSS by allowing developers to write code in one language and then compile it into CSS. Some examples of CSS preprocessor include: Sass, LESS etc.

Find Device Network enable and disable status in ionic - cordova app

In Ionic application the event “offline” and “online” can be added using addEventListener(). These events are attached to the document. The following are the sample codes, the respective callbacks will get fired once the device data connection enabled or disabled.