Angular 2.0 - tutoriel 10 : les formulaires

Dans ce tutoriel, nous allons voir comment créer un formulaire en Angular 2.0 puis le soumettre. L'essentiel se passera côté template, à l'aide des directives ngForm et ngControl. Ainsi, l'état et la validité de chaque champ texte du formulaire est surveillée par un ngControl, tandis que le formulaire lui-même…

Angular 2.0 - tutoriel 9 : créer un modèle

Dans ce tutoriel, nous allons voir comment créer un modèle, qui sera ensuite utilisé par un service et un component. Un modèle est une simple classe TypeScript ou ES6 que l'on peut exporter et importer là on l'on souhaite l'utiliser. …

Angular 2.0 cheat sheet

Une bonne petite cheat sheet Angular 2.0 en TypeScript. La même chose est disponible en JavaScript et Dart via le menu déroulant. …

Angular 2.0 - tutoriel 8 : *ngIf

Dans ce tutoriel, nous allons voir comment ajouter ou supprimer un élément du DOM en fonction de la valeur d'une variable. C'est l'équivalent de "ng-if" d'AngularJS 1.x …

Angular 2.0 - tutoriel 7 : implémenter une interface

Dans ce tutoriel, nous allons voir comment implémenter une interface dans Angular 2.0. TypeScript, qui est un langage que l'on peut considérer comme une surcouche à JavaScript et qui se trouve être le langage recommandé par l'équipe d'Angular 2.0, permet d'implémenter des interfaces. Une interface est simplement un…

Angular 2.0 - tutoriel 6 : créer un service

Dans ce tutoriel, nous allons voir comment créer un service que vous pourrez injecter dans vos components. De nouveau, Angular 2.0 simplifie les choses en proposant un seul type de service, là où AngularJS 1.X en proposait cinq (provider, factory, service, constant et value). En revanche, comme c'est…

Angular 2.0 - tutoriel 5 : gérer les événements du DOM

Dans ce tutoriel, nous allons voir comment gérer les événements du DOM. Il n'est plus nécessaire de chercher dans la documentation pour savoir si les développeurs d'Angular 2.0 ont prévu une directive qui gère un événement particulier, comme celles proposées par AngularJS 1.X (ng-click, ng-blur, ng-focus ...). Avec Angular…

Angular 2.0 - tutoriel 4 : data binding entre component et template

Dans ce tutoriel, nous allons voir comment s'effectue le binding entre les données présentes dans un component, et le template de ce component. Ce sera l'occasion de découvrir "*ngFor", la directive Angular 2.0 qui remplace "ng-repeat" propre à AngularJS 1.X. …

Angular 2.0 - tutoriel 3 : création d'un component

Les components seront les briques de vos applications Angular 2.0. Vous pourrez créer un component qui réprésentera la vue et la logique de l'en-tête d'une page, un autre component pour un menu latéral, un autre pour un composant métier. Un component pourra lui-même être composé d'autres components et être…

Angular 2.0 - tutoriel 2 : architecture d'une application

Nous allons voir comment est organisée une application Angular 2.0. Nous mettrons l'accent sur les "components", élements essentiels qui vous serviront à construire des composants faciles à imbriquer ou articuler, selon vos besoins. …

Création d'une application Angular 2 à l'aide angular2-seed

Afin de pouvoir disposer rapidement de tous les éléments requis pour développer une application Angular 2, nous allons installer angular2-seed. Cela vous permettra d'explorer une SPA (Single Page Application), de comprendre et d'articuler les élements essentiels d'une application Angular 2 (components, injectables, router ...) et de les utiliser dans vos propres…

Erreur "TS2661: Cannot re-export name that is not defined in the module."

Ajouter cette déclaration de variable : declare var Promise: PromiseConstructor; en tête du fichier angular2-seed\node_modules\angular2\src\facade\promise.d.ts corrige l'erreur TS2661: Cannot re-export name that is not defined in the module. Cela ne sera sans doute plus nécessaire une fois Angular 2.0 en RC (en…