Ajouter des répéteurs aux composants

Dans Générateur d'IU, utilisez des répéteurs pour répéter un ou plusieurs composants avec les résultats d’une ressource de données.

Avant de commencer

Rôle requis : ui_builder_admin

Pourquoi et quand exécuter cette tâche

Le composant de répéteur agit comme une boucle de base qui répète les données que vous fournissez dans plusieurs composants dans Générateur d'IU. Les répéteurs utilisent un tableau ou un tableau d’objets. Par exemple, le tableau [{"task » : « A"},{"task » : « B"}] répète le contenu qu’il contient deux fois. Les répéteurs vous permettent de lier des valeurs à une propriété de tableau de données. @item.Valeur. {property_name} lie les valeurs au composant à l’intérieur des répéteurs. Si vous souhaitez lier une tâche, vous pouvez la lier en tant que @item.value.task, et le répéteur affiche la valeur correcte.

Les composants à l’intérieur d’un répéteur répètent le nombre d’éléments dans la source de données, que la sortie du composant soit dynamique ou non. Par exemple, supposons que vous placiez un composant d’en-tête à l’intérieur d’un répéteur avec trois éléments de données, mais que vous ne modifiez pas le champ Étiquette. Ensuite, vous voyez trois instances de l’en-tête avec la même étiquette de sortie.

Procédure

1. Accédez à la Tous > Cadre de travail Now Experience > Générateur d'IU.
2. Ouvrez une expérience ou créez une expérience en sélectionnant + Créer.
   Consultez Configurer la façon dont les utilisateurs interagissent avec vos applications dans Générateur d'IU pour en savoir plus sur la création d’expériences.
3. Ouvrez l’éditeur de la page sur laquelle vous souhaitez ajouter le répéteur.
   Si vous n’avez pas créé de page pour votre expérience, consultez Créer une page dans Générateur d'IU pour plus d’informations sur la façon de créer une page.
4. Connectez une ressource de données à votre page.

   Par exemple, ajoutez la ressource de données Rechercher plusieurs enregistrements à votre page. Consultez Ajouter et configurer des ressources de données à une page pour plus d’informations sur la connexion d’une ressource de données.

   1. Sélectionnez la ressource de données Rechercher plusieurs enregistrements .
   2. Configurez la ressource de données pour utiliser la table Incident .
   3. Dans le champ Nombre maximal de résultats , entrez 5.

      La ressource de données Rechercher plusieurs enregistrements est configurée.

      
5. Sélectionnez un conteneur existant ou créez une mise en page de colonne.
   Consultez Organiser les composants dans les pages de Générateur d’IU pour plus d'informations.
6. Ajoutez le composant repeater à votre page.
   

   Pour en savoir plus sur l’ajout de composants, reportez-vous à la section Ajouter et configurer des composants.

7. Dans l’onglet Configurer , sélectionnez Aucun pour configurer le composant manuellement.
8. Dans l’onglet Configurer , ajoutez un tableau qui définit les données pour les composants répétés.
   1. Pointez sur le tableau de données et sélectionnez l’icône Lier les données (
   2. Sous Types de données, sélectionnez Ressource de données.
   3. Sous Vue pastille, sélectionnez la pilule look_up_multiple_records_1 .
   4. Dans la colonne suivante, double-cliquez ou faites glisser les résultats pour ajouter la sortie @data.look_up_multiple_records_1.results .
   5. Sélectionnez Appliquer.

      Les résultats de la ressource de données sont liés au composant de répéteur. Dans le répéteur, un composant représente chaque résultat.

      
9. Sous le répéteur que vous avez ajouté à l’étape précédente, sélectionnez Ajouter un composant.
   

   Par exemple, ajoutez un composant En-tête .

10. Dans l’onglet Configurer , sélectionnez Aucun pour configurer manuellement le composant En-tête.
11. Configurez le composant que vous avez imbriqué dans le répéteur.

    Par exemple, liez la valeur displayValue au composant. Consultez Connecter les données à vos composants pour plus d'informations.

    1. Déplacez votre curseur sur le champ Étiquette et sélectionnez l’icône Lier les données (
    2. Sous Types de données, sélectionnez Répéteur.
    3. Sous Vue pastille, sélectionnez la pastille de valeur .
    4. Dans la colonne suivante, sélectionnez la pastille numérique .
    5. Dans la colonne suivante, double-cliquez ou faites glisser displayValue pour ajouter la sortie @item.value.number.displayValue .
    6. Sélectionnez Appliquer.

       La valeur displayValue est liée au composant En-tête.

       
12. Sélectionnez Enregistrer.

    Seule la première valeur d’un ensemble de données s’affiche sur l’étape.

    
13. Affichez et testez votre page en sélectionnant le bouton Aperçu .
    Un onglet s’ouvre pour afficher l’aperçu de la page avec des données répétées.