Exercice simple avec AngularJS

La plus petite application AngularJS

J’attire votre attention sur ces nouveaux attributs qu’on nomme directive dans le monde AngularJs: ng-app et ng-model.

ng-app

L’attribut ng-app (directive) désigne l’élément de base (root) de l’application Angular. Cette directive est habituellement placée sur la balise <body> ou <html>. Voir la documentation de la directive ngApp.

ng-model

La directive ngModel permet d’associer (bind) un élément d’un formulaire (input, select, textarea) à une propriété du $scope. Voir la documentation de la directive href= »https://docs.angularjs.org/api/ng/directive/ngModel » target= »_blank »>ngModel.

{{ }}

Les accolades sont comparables à un « echo » ou un « print » qui affiche le contenu de la variable ou du modèle.

Exercice

Analyser le code et tenter de déterminer le comportement de cette application.   Copier le code et l’exécuter sur votre poste.    

La directive ng-repeat en action et premier contrôleur

La directive ngRepeat permet d’itérer sur une collection d’objets ou sur les propriétés d’un objet.  

index.html

todo.js

Poussons l’application en ajoutant des fonctions au contrôleur

index.html

todo.js

todo.css

 

Pourquoi AngularJS?

Un indice :

graphique angularjs ember.js et backbone.js

D’autres exemples

D’autres exemples sont disponibles sur le site de AngularJS.

Comments

comments