Dcouvrez les bases du framework AngularJS. Dans ce cours vous verrez d'abord la partiethorique avec les modules et les controllers puis un exemple complet de code source. Tout estdans la vido ci-dessous.

jQLeadBrite("#leadplayer_video_element_551DBE6E6E474").leadplayer(false, "eyJnYSI6dHJ1ZSwib3ZlcmxheSI6ZmFsc2UsInBvd2VyZWRfYnkiOmZhbHNlLCJwb3dlcmVkX2J5X2xpbmsiOiJodHRwOlwvXC93d3cucHJvZ3JhbW1hdGlvbi1mYWNpbGUuY29tXC8iLCJjb2xvcjEiOiIjRjVCQjBDIiwiY29sb3IyIjoiIzE3OThDRCIsImNvbG9yMyI6IiNGNUJCMEMiLCJ0eHRfc3VibWl0IjoiUkVDRVZPSVIgISIsInR4dF9wbGF5IjoiTGVjdHVyZSIsInR4dF9lbWwiOiJSZW5zZWlnbmV6IHZvdHJlIEVtYWlsLi4uIiwidHh0X25hbWUiOiJSZW5zZWlnbmV6IHZvdHJlIFByXHUwMGU5bm9tLi4uIiwidHh0X2ludmFsaWRfZW1sIjoiU1ZQLCByZW5zZWlnbmV6IHZvdHJlIEVtYWlsLi4uIiwidHh0X2ludmFsaWRfbmFtZSI6IlNWUCwgcmVuc2VpZ25leiB2b3RyZSBQclx1MDBlOW5vbS4uLiIsImxwX3NvdXJjZSI6IldQIFBsdWdpbiAxLjQuMi4xIFVubGltaXRlZCIsImlkIjoiNTUxREJFNkU2RTQ3NCIsIndpZHRoIjo5NDAsImhlaWdodCI6NTI5LCJ0aHVtYm5haWwiOiIiLCJ0aXRsZSI6IkxlcyBiYXNlcyBlc3NlbnRpZWxsZXMgXHUwMGUwIGNvbm5hXHUwMGVldHJlIHBvdXIgdXRpbGlzZXIgQW5ndWxhckpTIDogbGVzIG1vZHVsZXMsIGxlIGNvbnRyb2xldXIsIGxlcyB2dWVzICIsImRlc2NyaXB0aW9uIjoiTGVzIGJhc2VzIGVzc2VudGllbGxlcyBcdTAwZTAgY29ubmFcdTAwZWV0cmUgcG91ciB1dGlsaXNlciBBbmd1bGFySlMgOiBsZXMgbW9kdWxlcywgbGUgY29udHJvbGV1ciwgbGVzIHZ1ZXMgIiwiYXV0b3BsYXkiOmZhbHNlLCJzaG93X3RpbWVsaW5lIjp0cnVlLCJlbmFibGVfaGQiOnRydWUsIm9wdCI6ZmFsc2UsImN0YSI6eyJ0aW1lIjoiZW5kIiwiYnRleHQiOiJDbGlxdWV6IGljaSBwb3VyIGRcdTAwZTljb3V2cmlyIGxlIEd1aWRlIGxlIHBsdXMgbWludXRpZXV4IGV0IGNvbXBsZXQgc3VyIEphdmFTY3JpcHQgISIsInVybCI6Imh0dHA6XC9cL3d3dy5mb3JtYXRpb24tamF2YXNjcmlwdC50dlwvIiwiYXV0b19mb2xsb3ciOmZhbHNlLCJuZXdfd2luZG93IjpmYWxzZX0sInltIjoiSXlKbjJ

1 / 5

rWXFoQUkifQ==");

Afficher le texte de la vidoLes bases essentielles connatre pour utiliser AngularJS : les modules, le controleur,les vues Bonjour et bienvenu sur Dveloppement Facile. Voici un nouveau cours consacr aufabuleux Framework Angular JS, dans le cours prcdent vous avez vu justement, vous avezappris crer votre premire application avec Angular JS qui est, moi j'adore ce Frameworkdvelopp par Google, dans ce cours vous allez dcouvrir les bases, il y aura une partiethorique avec les bases, bases de fonctionnements, ce que vous pouvez faire ou pas avecAngular JS, et une grosse partie pratique avec un exemple de code source comment et deschangements pour que vous voyez les modifications tout a en direct.Les modules Angular JSAlors les modules donc dans Angular JS vous avez une notion de module qui vous permetd'encapsuler les diffrents lments votre application Angular, vous avez un contrleur,plusieurs contrleurs, des vues, des modles, plusieurs modles en fonction de la taille de votreapplication donc la cration d'un module s'effectue tout simplement avec la mthode module del'objet Angular, donc a vous permet de crer un module donc le code Angular.module le nom oapplication et des paramtres si vous souhaitez en transmettre ou pas, chaque lment del'application, votre application est dclare dans un module que ce soit l'application, lecontrleur, le modle etc. et vous avez plusieurs mthodes notamment pour dclarer uncontrleur la mthode contrleur, vous avez la mthode Factory galement. Le suivant codesuivant vous voyez qui s'affiche l'cran, a va vous permet de crer un module qui se nommeo application avec la dclaration nomme o contrleur donc on utilise la mthodeAngular.module pour crer votre application et aprs la mthode .Contrleur, o contrleur cesera dans la div ng-controller donc dans une div dans votre code HTML tout simplement aveccontroller single, c'est dans une fonction JavaScript, voil c'est ce qui s'affiche l'cran j'ai prisun peu plus de temps avec -App pour associer le contrleur ct JavaScript et cot vue, en faitl'affichage des lments ou traitement des lments de la vue tout simplement, donc voil unexemple du chargement du module application, de code, HTML donc ngv-app vous pouvez lemettre sur n'importe quel balise HTML gnralement on le met sur la balise body ou une balisediv, comme je vous l'ai dit dans la dernire vido, c'est en fonction de vos besoins, c'est vousde voir.Un controleur Angular JS Le contrleur lui, va fournir les donnes, et il va ragir enfonction des actions que l'utilisateur a effectu sur les vues, donc dans Angular JS un contrleurs'occupe d'initialiser l'tat du modle, il expose le modle et les fonctions la vue via l'objetscope, avec l'objet scope vous mettez jour les donnes du modle et ensuite ces informationssont affiches dans votre vue l'endroit o vous le souhaitez, il y a une raction auxchangements avec la notion de Angular JS de binding donc l vous avez un exemple de codesource de contrleur. Scope.config, par exemple vous rcuprez une configuration stockedans le stockage local HTML 5 scope.config c'est une donne, scope.event vous pouvezajouter des vnements, enlever des vnements toujours c'est des donnes donc vousconstruisez l'intelligence, la logique de votre application, ensuite ng.module Angular.moduleapplication, vous crez votre application, .Contrleur vous crez votre contrleur, rappelez-vousdans Angular JS il y a le modle de conception IOC, Inversion On Contrle, vous avez juste dire, voyez le code source, c'est.Contrleur, o contrleur, contrleur single donc vous donnez la

2 / 5

fonction utiliser, les diffrents paramtres et IOC a va s'occuper d'instancier votre contrleuravec les paramtres que vous avez dfinis et vous renvoyez une instance, derrire vouspouvez utiliser scope pour grer vos donnes donc c'est la puissance Angular JS. Pourconserver des contrleurs simples et maintenables, vous avez le choix, soit vous crez uncontrleur par vue, donc vous avez diffrentes zones dans votre page HTML, dans votreapplication SPA, plusieurs zones, vous pouvez crer un contrleur par zone, si vous avez unezone trs complexe vous pouvez mme crer plusieurs contrleurs pour cette zone parfonctionnalits en fait, a, c'est votre exprience de dveloppeurs qui vous parlera et surtout lacomplexit de votre application, dans une application comme Gmail, il n'y a pas seulement, jepense qu'il y a plus de contrleurs, il y en a un pour cette zone et peut tre deux, trois pourcette zone-l, il faudrait voir le code source c'est comme a que je ferai. Par exemple si vousavez une application Web, une page Web classique vous avez un contrleur pour l'entte, uncontrleur pour une zone de liste, un contrleur pour une zone de dtails et un contrleur pourun pied de page de dfini, donc des contrleurs qui interagissent avec les diffrentes vues, etqui mettent jour les donnes du modle.Exemple pratique d'Angular JS Maintenant voici unexemple pratique de code source vous allez dcouvrir la cration de plusieurs contrleurs, deplusieurs zones, des contrleurs qui vont grer plusieurs zones dans la vue. C'est partit. Dansce code source vous allez un petit peu plus pousser l'utilisation d'Angular JS petit petit vousmontez en puissance, je passe vite l'inclusion du framework Angular JS, le fichier JavaScriptmain pour grer le contrleur et le modle Angular JS, l c'est une zone qui n'est pas gre parAngular JS et l, la zone est gre par Angular JS toujours avec ng-app, a c'est expliqu dansle dernier cours, vous avez votre contrleur main contrleur, la vue view contrleur ici avecpage et title, et o contrleur user.name. Un contrleur principal, un autre contrleur et untroisime contrleur avec des variables diffrentes afficher donc si vous avez compris leprincipe du prcdent cours avec Angular JS celui-l va tre trs simple, vous crez votreapplication, application Angular JS ici, ensuite main contrleur, vous appelez la fonction maincontrleur qui est ici et vous la relie votre code HTML ici, view contrleur est reli ici et aveccette fonction qui est ici, tout simplement et ensuite vous avez o contrleur qui est reli toutsimplement ici, lorsque vous crez le module o contrleur et vous appelez contrleur singledonc soit vous appelez la fonction JavaScript et la partie attribut HTML de la mme faon ouvous pouvez carrment donner un nom diffrent garder l'attribut ng contrleur o contrleur et lafonction JavaScript s'appelle contrleur single, ensuite vous avez diffrentes variables renseigner, c'est exactement le mme principe, dans main contrleur vous pouvez accder autitle, pourquoi ? Dans le cours je vous ai expliqu la notion d'hritage, lui c'est le contrleur prequi englobe tous les enfants ici donc il peut trs bien accder ces trois variables toutes cesvariables et les modifier, ce qui fait directement application dveloppement facile, ensuite vousavez view contrleur qui est ici, il modifie page Tittle donc rien d'extraordinaire et le contrleursingle qui modifie tout simplement l'objet user aprs bien videmment comme je vous l'aiexpliqu dans le cours, vous pouvez ajouter dans la configuration enlever des objets deconfiguration, mettre une fonction quand la configuration est termine, rcuprer uneconfiguration partir du stockage HTML 5 local donc a c'est vraiment en fonction de votreapplication que vous allez grer tout cela, soit dans le contrleur main contrleur ou dans lecontrleur single, suivant l'apport que vous souhaitez avoir avec votre configuration, contrleursingle il peut accder uniquement cette variable sinon il est oblig d'utiliser le parent pourremonter plus haut, alors que main contrleur peut accder toutes les variables, comme jevous l'ai dit, l'intrt c'est de compartimenter votre application avec plusieurs contrleurs qui

3 / 5

grent plusieurs zones de votre page HTML, c'est aussi simple que a, donc comme rsultatvous avez application dveloppement facile ici, utilisation Angular JS ici et hello Mathieu duprojet dveloppement facile. Pourquoi il y a des CSS diffrents ? Justement la rponse est dansla question, on a utilis des feuilles de style CSS pour crer un affichage diffrent donc title estjuste remplac par la donne, la valeur de la donne, donc application dveloppement facile etpage Tittle utilisation d'Angular JS et ensuite vous avez le style CSS qui s'applique la baliseH1 et la balise H2, d'o un affichage diffrent, une vue, une interface diffrente donc voil unnouvel exemple de code Angular JS vous voyez que c'est trs simple je ne vais pas dire quec'est enfantin mais pour l'instant c'est trs abordable.Votre plan d'action ! Alors votre pland'action de comme d'habitude vous trouverez le code source complet en tlchargement sousce cours vido, si vous avez des questions posez-les simplement sous cette vido, l'quipedveloppement facile vous rpondra avec grand plaisir, et maintenant si vous voulez recevoirtous les cours que ce soit sur phaser, Angular JS donc gratuitement il y a un formulaire souscette vido, il y a un formulaire qui est apparu au-dessus de cette vido il suffit de renseignervotre nom, votre adresse e-mail et vous recevrez tous ces cours dans votre bote mail, et sivous voulez aller beaucoup plus loin il y a un lien au-dessus de moi, il suffit de cliquer sur celien ou sur cette image et l vous avez allez tre dirig dans une deuxime vido ou vous allezdcouvrir de A Z, tapes par tapes comment crer des applications performantes, des Webapp qui soient compatibles la fois, donc vous codez une seule fois et vous dployez votreapplication sur tous les priphriques, Smartphones, Aplle ou Android, tablette Apple ouAndroid, mme Windows phone et le Web donc en codant une seule fois donc vous allezdcouvrir par exemple le Framework phaser, Ionic framework, des stratgies trs avances dedveloppement et en plus l'quipe dveloppement facile rpond toutes vos questions c'est--dire que si vous vous demandez comment implmenter tel ou tel exemple de cours dans votreapplication, vous avez des difficults vous poser une question, vous joignez votre code sourcel'quipe dveloppement facile corrige votre code source, vous le renvoi corrig et vous donnedes informations supplmentaires, cliquez simplement sur l'image au-dessus de moi on seretrouve dans la deuxime vido tout de suite.

Code source de l'exemple de code sur les bases d'AngularJSRetrouvez le code source comment sur les bases d'angularJS

Downloads

04 bases angularJS

Code source comment d'une application AngularJS

4 / 5

AngularJS version 1.3 est galement prsent dans l'archive.

Posez vos questions sur les modules et les controllers duframework AngularJSUtilisez la zone commentaire pour poser vos questions sur l'implmentation du modle deconception dans AngularJSLes bases essentielles connatre pour utiliser AngularJS : lesmodules, le controleur, les vues

Tlcharger Gratuitement votre Formation Professionnelle Dveloppement Web : Cliquez icipour Recevoir les Vidos

Powered by TCPDF (www.tcpdf.org)

5 / 5