Valeurs par défaut du routeur et désérialisation

Vous pouvez définir la valeur par défaut de la propriété du paramètre de requête du contrôleur dont la valeur ne sera pas sérialisée dans l'URL.

Syntaxe

Ember.ArrayController.extend ({
   queryParams: 'queryParameterName',
   queryParameterName: defaultValue
});

Exemple

L'exemple donné ci-dessous spécifie la définition de la valeur par défaut du paramètre de requête. Créez une nouvelle route et nommez-la par défautvaluedeserialize et ouvrez le fichier router.js pour définir les mappages d'URL -

import Ember from 'ember';                   
//Access to Ember.js library as variable Ember
import config from './config/environment';
//It provides access to app's configuration data as variable config 

//The const declares read only variable
const Router = Ember.Router.extend ({
   location: config.locationType,
   rootURL: config.rootURL
});

//Defines URL mappings that takes parameter as an object to create the routes
Router.map(function() {
   this.route('defaultvaluedeserialize');
});

//It specifies Router variable available to other parts of the app
export default Router;

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

<h2>Default Values and Deserialization</h2>
{{#link-to 'defaultvaluedeserialize'}}Click Here{{/link-to}}

Lorsque vous cliquez sur le lien ci-dessus, la page doit s'ouvrir avec une zone de saisie qui prend une valeur saisie par l'utilisateur. Ouvrez le fichier defaultvaluedeserialize.hbs et ajoutez le code suivant -

//sending action to the addQuery method
<form {{action "addQuery" on = "submit"}}>
   {{input value = queryParam}}
   <input type = "submit" value = "Send Value"/>
</form>
{{outlet}}

Maintenant, ouvrez le fichier defaultvaluedeserialize.js créé sous app / controllers / avec le code suivant -

import Ember from 'ember';

export default Ember.Controller.extend ({
   //assigning query parameter name as 'query'
   queryParams: 'query',
   //assigning the query param to a default value as 1
   query: 1,
   queryParam: Ember.computed.oneWay('query'),
   actions: {
      
      addQuery: function () {
         this.set('query', this.get('queryParam'));
         document.write(this.get('query'));
      }
   }
});

Production

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

Lorsque vous cliquez sur le lien, il affiche la valeur par défaut spécifiée dans la zone de saisie -

Après avoir cliqué sur le bouton, il affichera la valeur par défaut et il ne sera pas sérialisé dans l'URL -