AndrewJBateman / ionic-angular-material

:clipboard: Ionic app to use the angular material library. Another great tutorial from Simon Grimm at the Ionic Academy

⚡ Ionic Angular Material

• App created using the Ionic framework to use mat select to select from a list of options, mat paginator to navigate pages and Material Stepper to divide content into logical steps.
• Note: to open web links in a new window use: ctrl+click on link

📄 Table of contents

• ⚡ Ionic Angular Material
  • 📄 Table of contents
  • 📚 General info
  • 📷 Screenshots
  • 📶 Technologies
  • 💾 Setup
  • 💻 Code Examples
  • 🆒 Features
  • 📋 Status & To-do list
  • 👏 Inspiration
  • 📁 License
  • ✉️ Contact

📚 General info

• Angular Material is the implementation of Material Design for Angular. It offers a wide range of components and patterns for navigation, forms, buttons, layouts etc.

📷 Screenshots

📶 Technologies

• Ionic v6
• Angular v15
• Ionic/angular v6
• Angular Material v15

💾 Setup

• Run npm i to install dependencies
• To start the server on localhost://8100 type: ionic serve

💻 Code Examples

• extract from home.page.html of the material table that displays the user first name using data-interpolation.

  <ng-container matColumnDef="first_name">
    <th mat-header-cell *matHeaderCellDef> First Name </th>
    <td mat-cell *matCellDef="let user"> {{user.first_name}} </td>
  </ng-container>

🆒 Features

• User list can be extended. Lots of additional material components can be added.

📋 Status & To-do list

• Status: Working.
• To-do: Nothing

👏 Inspiration

• Project inspired by Simon Grimm´s Youtube video: ionic angular material

📁 License

• This project is licensed under the terms of the MIT license.

✉️ Contact

• Repo created by ABateman, email: [e-mail]