Ember js récupérer l'objet de la route précédente

Question

Je suis en train de construire ma première application EmberJS.

Initialement, à partir de l'itinéraire de l'index, je vais afficher un A. Lorsque l'utilisateur clique sur A, il sera dirigé vers /a . Le composant A aura un champ url après avoir rempli le formulaire et cliqué sur un bouton, il sera dirigé vers /b . Le composant B a également un champ email. Remplissez-le et cliquez sur un bouton qui vous dirigera vers /summary qui affiche ce que j'ai rempli en A et B. Comment pourrais-je le faire dans les règles de l'art ?

J'utilise ember-cli et this.transitionTo(/b) pour aller à la route /b

Answer 1

Il semble que des routes imbriquées seraient utiles pour cette mise en œuvre.
/a - route

model(){
 return {url:'default'};
}

a.hbs

{{comp-a model=model}}

/a/b - route

model(){
 return {email:''};
}

a/b.hbs

{{comp-b model=model}}

/a/b/summary - route

model(){
 return {amodel:this.modelFor('a'),bmodel:this.modelFor('b')};
}

a/b/summary.hbs

{{comp-a model=model.amodel }}
{{comp-b model=model.bmodel }}

Answer 2

Voici un tutoriel qui explique exactement comment créer un formulaire à plusieurs étapes comme celui que vous demandez. http://romulomachado.github.io/2016/12/06/multi-step-form-with-ember.html

En utilisant un système d'itinéraires imbriqués, cela est assez simple.

Router.map(function() {
  this.route('checkout', function() {
    this.route('personal-info');
    this.route('shipping-info');
    this.route('payment-info');
    this.route('confirmation');
  });
});

et vous pouvez ensuite utiliser un modèle de "commande" ou de "formulaire" pour conserver l'information.

J'ai suivi l'exemple et j'en ai construit un avec la possibilité de modifier et de confirmer à la fin aussi : )