Ceci est une ancienne révision du document !
TD n°6
 | Ce projet utilise le repository github : boards-app |
- Projet boards
- Application gestion de projets SCRUM
Objectifs
- Factorisation du code
- Réutilisation
Prise en main
Vous pouvez au choix :
- Partir de votre propre projet et y inclure les éléments du projet Github
- Partir du projet GitHub pour y intégrer vos propres fonctionnalités
Factorisation des vues
template partagé
Une route peut redéfinir la propriété templateName pour permettre l'utilisation d'un même template par plusieurs routes :
C'est le cas des routes projects/new et projects/update/:project_id qui partagent le template projects/frm.hbs :
import...
...
export default Route.extend({
templateName: 'projects/frm',
...
}
Composants
Composant ui-form
Le composant ui-form permet de factoriser la création d'un formulaire de modification d'un model (il insère les parties header et footer du formulaire):
Exemple d'utilisation :
{{#ui-form newValue=model.newProject
oldValue=model.oldProject
validation="save" cancel="cancel"
bigIcon='table' isNew=model.isNew
header='Project'}}
<div class="field">
<label for="name">Name</label>
{{input id="name" placeholder="Name" value=model.newProject.name}}
</div>
...
{{/ui-form}}
| Attribut | Rôle |
|---|---|
| oldValue | objet à modifier (model) |
| newValue | copie du model modifiée dans le formulaire |
| isNew | Détermine s'il s'agit d'une insertion ou d'une mise à jour |
| bigIcon | Icône affichée dans l'en-tête |
| header | Type de l'objet affiché dans l'en-tête |
| validation | Action à associer à la validation des données, l'action correspondante devra avoir pour prototype : (oldValue,newValue) |
| cancel | Action à associer à l'annulation des modifications |