[Build 14] – Building a Single Page Application with ASP.NET and AngularJS

Mail de Mehdi
Jeudi 3 avril 2014 16:42

Building a Single Page Application with ASP .NET and AngularJS

// Speakers:
David Catuhe, Jon Galloway

Session un peu décevante, niveau 300 mais plutôt destinée aux personnes n’ayant jamais fait d’AngularJS.

Les démos sont là pour attirer ces gens sur ce framework.

On débute avec la façon avec laquelle on intègre Angular dans une page HTML => nous avons besoin que d’un seul fichier
«angular.min.js»

Trois solutions sont possibles pour ajouter AngularJS à un projet => soit on télécharge les fichiers, soit on utilise NuGet ou un CDN (le plus conseillé par David).
// Début de la démo :

Initialisation du controller de la vue, David ajoute comme injection $scope pour accéder au scope de la vue. Il initialise une variable avec un tableau de deux éléments qui seront bindés dans la vue avec un repeater, il lance la page, et voilà ! ça marche très simplement.

Ensuite on nous introduit les différentes façon d’accéder à de la data, avec $http qui est basé sur une version light de jQuery, et $resource qui est un objet spécifique fait pour du restful api (qui sera utilisé un peu plus tard dans la démo pour interroger le serveur au lieu d’avoir la data en local)

Pour les utiliser depuis le controller, il faut les ajouter dans les injection de dépendance de celui-ci.

On nous présente comment créer un service pour rendre transparent l’accès aux données.

Démo de comment on peut créer un filtre dans un repeater.

Une petite démo du Two-Way Data Binding avec enregistrement en local des données.

Une démo sur les animations (avec le repeater , angular ajoute des classes spécifiques quand un element est ajouter/supprimer/modifier dans la liste et on peut donc facilement faire des animations en css).

Présentation de comment créer des routes dans Angular avec le template de la « page » qui va avec.

Mehdi

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion / Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion / Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion / Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion / Changer )

Connexion à %s