Maison  >  Article  >  interface Web  >  Comment transmettre des paramètres avec ui-sref et les récupérer dans le contrôleur ?

Comment transmettre des paramètres avec ui-sref et les récupérer dans le contrôleur ?

Mary-Kate Olsen
Mary-Kate Olsenoriginal
2024-11-06 15:37:03145parcourir

How to Pass Parameters with ui-sref and Retrieve them in the Controller?

Passer des paramètres avec ui-sref et récupérer dans le contrôleur

Problème

Vous devez transmettre deux paramètres à un état en utilisant ui-sref et accédez-y dans le contrôleur d’état. Cependant, vous rencontrez des problèmes avec des valeurs de paramètres non définies dans le contrôleur.

Solution

Pour transmettre des paramètres avec ui-sref et les récupérer dans le contrôleur, suivez ces étapes :

  1. Mettre à jour la définition de l'état :
$stateProvider
    .state('home', {
      url: '/:foo?bar', // Define parameter placeholders in the URL
      views: {
        '': {
          templateUrl: 'home.html',
          controller: 'MainRootCtrl'
        },
        ...
      }
    });
  1. Utiliser $stateParams dans le contrôleur :
.controller('MainRootCtrl', function($scope, $state, $stateParams) {
    var foo = $stateParams.foo; // Access fooVal
    var bar = $stateParams.bar; // Access barVal
})

Configuration des paramètres granulaires

En plus des espaces réservés pour les paramètres d'URL, vous pouvez également définir des paramètres granulaires à l'aide de l'objet params dans les définitions d'état :

.state('other', {
    url: '/other/:foo?bar',
    params: {
        foo: {
          value: 'defaultValue',
          squash: false,
        },
        bar: {
          array: true,
        },
        hiddenParam: 'YES',
      }
    ...

Exemple d'utilisation

Pour transmettre des paramètres à l'aide de ui-sref et les récupérer avec la définition d'état mise à jour :

<a ui-sref="home({foo: 'fooVal1', bar: 'barVal1'})"></a>
<a ui-sref="home({foo: 'fooVal2', bar: 'barVal2'})"></a>

Options de configuration des paramètres

Les paramètres de l'objet params incluent :

  • value : Spécifie la valeur du paramètre par défaut.
  • array : Traite le paramètre comme un tableau.
  • squash : Configure la façon dont les valeurs des paramètres par défaut sont représentées dans l'URL.

Pour plus d'informations, reportez-vous à la documentation de ui-router sur les paramètres d'URL et $stateProvider.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn