Angular Ionic - noelno/dovelei GitHub Wiki

Modules ES6 :

• exporter une fonction, une variable ou une classe

  export function sayHello(){ console.log("hello!"); }

• l'importer dans un autre fichier

import { sayHello } from '../path/to/some-file';

sayHello(); // This will log 'hello!' to the console

En bref les fonctions, variables et méthodes d'un module peuvent être réutilisées n'importe où.

Dans Ionic, la majorité des fichiers .ts :

• importent des modules
• déclarent une suite de traitements sur les données issues de ces modules sous forme de fonction, de classe ou de variable
• exportent dans un module ces traitements

@component : indique à Angular que la classe qui suit est un composant. Fournie par le core d'Angular. Un composant associe du HTML (un template) à une classe et à un sélécteur (un élement XML qui sera inseré dans la vue).

Le point d'entrée de l'application est @NgModule, dans app/app.module.ts. Celui-ci déclare que l'élement racine de l'application Ionic est le composant MyApp, déclaré dans app/app.component.ts et lié au template app/app.html

Pages. Les pages sont des composants. Dans Ionic chaque page a son propre dossier :

• un module .ts contenant la déclaration du composant
• un template HTML
• un fichier Sass pour les styles spécifiques au template

Le module .ts de la page doit permettre de récupérer le contenu avant de l'insérer dans le template associé. En début de classe on déclare les variables qui vont contenir les données à afficher. Dans le constructeur on récupère en paramètre les instances des modules qui vont nous permettre de récupérer ces données.

Data-binding :

• *ngFor={{let item in items }} //boucle
• {{i++}} //interpolation de variable, affichera la valeur de i
• [src]="item.picture_url" //property binding, pas besoin des curly braces [hidden]="!item.isEmpty"
• (click)="handleClick()" //event binding Peut passer en paramètre l'objet itéré, utile pour passer un id d'une page à l'autre
• [(ngModel)]="username" //two-way data binding : synchronise la valeur d'une variable côté classe et côté template. Penser à déclarer à l'avance la variable username. Utile pour les formulaires.

Directive : attribut pouvant être affecté à un élément du template. Il est possible de créer ses propres attributs et de leur associer une classe, une fonction ou une variable.

Provider : service. Récupération de données d'une API, Push, Notifications,

You can create a new provider using the command: ionic g provider MyProvider
You must import the provider into app.module.ts and add it to the providers array
You must import the provider into any component that uses it
You must inject the provider in the constructor of any component that is using it

Pour des questions d'accessibilité, privilégier les boutons et l'attribut tappable