Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

Découvrir Ember.js

Comprendre les routes automatiques

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Exploitez les routes générées automatiquement par Ember.js. Vous allez notamment mettre en forme les pages de chargement ou d'erreurs.
05:44

Transcription

J'aimerais maintenant vous parler de quelques routes qu'on appelle des Routes automatiques . Je vous ai déjà parlé tout à l'heure de la route Application, Donc la route Application, c'est celle qui est toute en présence, c'est-à-dire c'est la première route de votre application, et ensuite on a la route Groups et la route Groups.group. D'accord, on en a trois pour l'instant. Donc celle-là elle est automatique et en plus de ça, à chaque fois que vous avez une route qui en inclut d'autres sous la forme de sous-route, ce qui est le cas, par exemple, de notre route Groups qui inclut une sous-route Groups.group ou alors même de la route Application même, puisqu'elle inclut celle-ci qui elle-même inclut une autre. Il y a une autre route automatique qui s'ajoute, c'est la route Index. Alors, la différence entre la route Index et la route en elle-même, c'est la suivante. La route Groups qu'on a utilisé jusqu'à présent, a des rendus même si on s'arrête pas à ce chemin ainsi. On continue en fait jusqu'à la route en fin et le rendu. Si, par contre, je souhaite mettre du code qui ne sera affiché que quand jarrive sur cette page-là, par exemple sur Groups, mais que si je vais plus loin, par exemple La famille, je voudrais peut-être retirer cette liste pour n'afficher que les infos de la famille, il faudra que je le mette dans la soute index de cette route-là. Voyons voir comment on va faire ça. C'est très simple. La route Index se génère automatiquement, il n'y a rien à faire de spécial, si vous voulez l'utiliser, il vous suffit en fait d'ajouter le fichier de plus. Donc, par défaut il va utiliiser groups, ça c'est la route standard. Et si vous voulez utiliser index, ça sera groups slash index. Donc je vais ajouter un fichier index point hbs [ bruit de clavier d'ordinateur] Je vais en lui le contenu [ inaudible ] pour mettre le nom et je vais déplacer tout ce que j'ai mis dans groups, je vais laisser l'outlet qui est varaiment important puisque justement c'est celle qui inclut les autres, et on va mettre notre liste ici. J'enregistre. On va voir en a plus la liste des éléments, par contre, si je vais à l'index même, la route groups, là, ça marche. Quand je vais que tiquer ce lien, on voit qu'il a remplacé le contenu, il n'a pas ajouté comme il faisait jusqu'à présent. Pourquoi? Parce qu'il va rendre la route application, la route groups et la route groups.group. A aucun moment il va afficher la route groups.index. Pourquoi? Parce qu'on séparait ici, par contre je m'y arrête, on demande en fait l'index de la route group, et là, il l'affiche. Donc ça c'est une autre route automatique, elle existe pour chaque dossier. Ça marche aussi pour la route application, il suffit d'ajouter un index point hbs pour que ça marche. Donc ce serait application slash index point hbs pour que ça marche de la même manière. Nous avons aussi la possibilité, si vous le souhaitez, de définir de modèles pour l'index, ce seront pas les mêmes que pour la route normale, ça sera le même principe, il suffira dans route d'ajouter index point js ici, dans groups, et dans ce cas-là vous aurez un objet route spécial en ce cas-là et vous pourrez changer le modèle que vous voudrez à ce moment. Il existe deux autres routes qui sont automatiques, de la même manière qu'application et la route index, sans les routes de chargement. Depuis tout à l'heure on est passé sur un téléchargement donné depuis un serveur. Pendant que cette route charge, on a une page blanche. Si le serveur n'ait du temps à répondre, il va rester longtemps avec une page blanche. Ce qu'il est possible de faire, c'est d'utiliser une sous-route automatique, qui s'appelle loading. Si j'ajoute ici un nouveau fichier loading point hbs [ bruit de clavier d'ordinateur ] Chargement C'est pas [inaudible] ça à le voir parce que le serveur local est quand même assez rapide, dans la peu y est temps de le voir. C'est parce qu'en ayant placé ici, ça sert de page de chargement pour les chargements en fin ce serait arrêté plutôt pour group. Moi, ce que je veux, c'est qu'il serve pour le chargement de ma liste du group parce que c'est ça qui est un petit peu plus long. Donc, je vais le déplacer, ce fichier loading et le mettre ici, remplacer, on enregistre. Celui-ci c'est plus bon, j'ai pas besoin de le sauvegarder. Donc, il doit être ici. On va donc réessayer. En quelques millisecondes on le voit paraître, et ça arrive juste après. Donc pour les pages de chargements vous avez plusieurs façons Donc, en les laissant ici, toutes les routes ou les routes en fin qui ont paru définies Vous utilisez cette page de chargement, alors, je vais renommer celui-ci, ça serai groups avec exatement le nom tiret loading. Pour nous ça changera rien, [ inaudible] et disparaît juste après, et par contre il sera pas utilisé pour d'Addons. vous pouvez soit faire un chargement que pour cette page-là, soit enlever le groups, et ça vous donnera un chargement pour toutes les routes de ce niveau-là, ou les routes inférieures, celles n'ont pas elles-mêmes redéfinies sur le même principe leur chargement. Il reste enfin une dernière route automatique que nous n'ont pas vue. C'est celle qui consent les erreurs. Elle fonctionne sur le mêmes principe que celle du chargement. Donc, il faut qu'on soit déclaré au même niveau que celui du chargement, il faut l'appeler error point hbs, [ bruit de clavier d'ordinateur ] erreur de chargement , je l'enregistre. Pour l'instant, elle ne s'affichera jamais puisqu'on n'a pas d'erreurs, mais si je vais dans groups point js sur ma route et que je change ici mon trois mille en trois mille un, par exemple, pour que ça colle plus [ inaudible ] qu'en titre On va voir ce que ça donne, voilà erreur de chargement, vous voyer du rouge dans la console. Et au niveau [ inaudible ] on peut lui mettre quelque chose de plus joli, On ne sait pas si c'est vraiment joli, mais en tout cas au lieu que le site flante qui est une page blanche on anticipe l'erreur et on affiche un message pour l'utilisateur. Encore une fois, puisque cette erreur est placée à cet endroit-là, elle va gérer toutes les sous-routes du même niveau. Et je voulais qu'elle gère que groups, ça serait groups tiret erreur point hbs.

Découvrir Ember.js

Créez vos composants et mettez en page vos sites avec une facilité déconcertante avec Ember.js. Apprenez à créer des routes et à charger vos modèles depuis un service web externe.

2h57 (37 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
Spécial abonnés
Date de parution :31 mars 2016

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !