EmberJS - Modèles de segments multiples

Pour plusieurs segments, vous pouvez fournir un modèle ou un identifiant pour chaque segment si l'itinéraire est imbriqué.

Syntaxe

Router.map(function() {
   this.resource('route_name');
   this.resource('route_name', { path: 'route_path' });
});

Exemple

L'exemple montre l'utilisation de plusieurs segments dans l'itinéraire imbriqué en fournissant un identifiant au segment. Créez deux routes avec les noms comme info et enregistrez et ouvrez le fichier router.js pour définir les mappages d'URL -

import Ember from 'ember';
import config from './config/environment';

const Router = Ember.Router.extend ({
   location: config.locationType,
   rootURL: config.rootURL
});

Router.map(function() {
   this.route('info');
   this.route('record', { path: 'records/:records_id' });
});

export default Router;

Ouvrez le fichier fichier application.hbs créé sous app / templates / avec le code suivant -

{{#link-to 'info'}}Fruits{{/link-to}}
{{#link-to 'record' recoModel}}Some Record{{/link-to}}
{{outlet}}

Lorsque vous cliquez sur le lien "Fruits", la page doit ouvrir le fichier info.hbs , qui contient le code suivant -

<p>Some Fruits</p>
<ul>
   <li>Orange</li>
   <li>Banana</li>
</ul>
{{outlet}}

Si vous cliquez sur le lien Some Record , la page doit ouvrir le fichier record.hbs , qui contient le code suivant -

<p>Some Records</p>
{{model.name}}
{{outlet}}

Créez maintenant le contrôleur application.js , qui sera créé sous app / controller / to avec le code suivant -

import Ember from 'ember';

export default Ember.Controller.extend ({
   recoModel: function(){
      //return the records value to the called route
      return {records_id:1, name:'Docs List'};
   }.property()
});

Production

Exécutez le serveur de braises; vous recevrez la sortie suivante -

Lorsque vous cliquez sur le lien Fruits , il affichera le texte suivant du fichier modèle -

Lorsque vous cliquez sur le lien Some Record , il affichera le texte suivant du fichier modèle -