Sign In Start Free Trial
Account

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Learning Ionic
  • Toc
  • feedback
Learning Ionic

Learning Ionic

By : Ravulavaru
4.4 (14)
close
Learning Ionic

Learning Ionic

4.4 (14)
By: Ravulavaru

Overview of this book

This book is intended for those who want to learn how to build hybrid mobile applications using Ionic. It is also ideal for people who want to explore theming for Ionic apps. Prior knowledge of AngularJS is essential to complete this book successfully.
Table of Contents (12 chapters)
close
11
Index

The ion-list and ion-item directives


Since we are familiarizing ourselves with most of Ionic's directives and services, I thought it worth mentioning the ion-list and ion-item directives.

Lists are one of the most common display patterns when working with mobile apps. In Ionic, you can use the CSS version of the lists, as we have seen in Chapter 3, Ionic CSS Components and Navigation, or you can use the directive version of the lists.

The advantage of using the directive version of the list is that it provides additional attributes such as ion-delete-button, ion-reorder-button, and ion-option-button, which help us manage the lists better.

We will be testing these directives by scaffolding a new blank app; run this:

ionic start -a "Example 25" -i app.example.twentyfive example25 blank

Using the cd command, go to the example25 folder and run this:

  ionic serve

This will launch the blank template in the browser.

We will be implementing an example, provided in the Ionic docs, that covers all the...

Unlock full access

Continue reading for free

A Packt free trial gives you instant online access to our library of over 7000 practical eBooks and videos, constantly updated with the latest in tech
bookmark search playlist font-size

Change the font size

margin-width

Change margin width

day-mode

Change background colour

Close icon Search
Country selected

Close icon Your notes and bookmarks

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete