Réutiliser les composants avec les fournisseurs d’angle

Les fournisseurs d’angle sont des composants réutilisables qui peuvent être injectés dans plusieurs widgets. Pour garantir un chargement rapide des widgets et un portail performant, créez des fournisseurs d’angle au lieu de surcharger vos contrôleurs clients avec des données persistantes et une logique supplémentaire. Avec les fournisseurs d’angle, vous pouvez conserver les données pendant toute la durée de vie de vos Portail de services données et réutiliser des composants et des objets de données dans plusieurs widgets.

Avant de commencer

Rôle requis : admin ou sp_admin

Pourquoi et quand exécuter cette tâche

En créant un fournisseur d’angle, vous pouvez :

• Synchronisez les widgets lors du changement d’enregistrements ou de filtres.
• Partagez le contexte entre les widgets.
• Maintenir et conserver l’état.
• Créez des comportements et injectez-les dans plusieurs widgets.

Pour en savoir plus, rendez-vous sur Fournisseurs d’angle.

Conseil :

Pour faciliter la maintenance et le dépannage, supprimez tous les fournisseurs inutilisés de la liste connexe Fournisseurs d’angle dans la table Widget [sp_widget].

Procédure

1. Accédez à la Tout > Portail de services > Configuration du Portail de services > Tables de portails > Fournisseur d'angles de widget.
   La table Fournisseurs d’angles de widget s’ouvre.
2. Cliquez sur Nouveau et créez un enregistrement.
3. Sélectionnez le type de fournisseur d’angle.
   • Directive
   • Usine
   • Service
   Pour faciliter la migration vers ECMAScript 6 ou une version ultérieure, envisagez d’utiliser des services plutôt que des usines.
4. Définissez un nom.
   Vous utiliserez le nom pour associer le fournisseur à votre widget.
5. Ajoutez un script dans le champ Script client .

   Une usine de base qui formate un nombre en devise américaine.

   function formatterFactory(){
     var myVal = Number;
     return {
       format: function(myVal) {
         return '$' + myVal.toFixed(2);
       }
     }
   }

6. Associez le fournisseur d’angle à un widget.
   1. Accédez à <yourInstanceURL>/sp_config ?id=widget_edit.
   2. Ouvrez le widget que vous souhaitez associer au fournisseur d’angle.
   3. Sous Listes connexes, sélectionnez Fournisseurs d’angle.
   4. Dans la liste des fournisseurs d’angle , cliquez sur Nouveau.
   5. Dans le champ Fournisseur d’angle , sélectionnez le fournisseur approprié.
   6. Vérifiez le champ Widget pour vous assurer que vous associez le fournisseur d’angle au widget correct.
   7. Cliquez sur Enregistrer.
7. Mettez à jour les scripts appropriés dans votre widget pour injecter le fournisseur d’angle dans le widget.

   Injectez la fabrique dans votre script client widget en transmettant le nom de la fabrique comme argument dans votre fonction de contrôleur client. Vous pouvez ensuite accéder à l’objet défini dans la fonction factory de votre script client widget.

   function(formatterFactory) {
     /* widget controller */
     var c = this;
     console.log(formatterFactory.format(300));
   }

   Si vous définissez une directive, utilisez-la dans le modèle HTML du widget.

8. Pour modifier le fournisseur d’angle une fois qu’il est enregistré avec votre widget, ouvrez le script client du fournisseur d’angle dans l’éditeur de widget.
   1. Accédez à la Configuration du Portail de services > Éditeur de widget.
   2. Sous Modifier un widget existant, sélectionnez le widget associé à votre fournisseur d’angle.
   3. Dans le menu Afficher , ouvrez la liste Dépendances et sélectionnez le fournisseur d’angle.
      Remarque :

      Seuls les fournisseurs d’angle associés au widget sont affichés dans la liste des dépendances . Cette liste inclut toutes les ressources externes dont dépend votre widget.
      Le script client Angular Provider s’affiche dans l’éditeur de widget. Dans l’interface de l’éditeur de widget, vous pouvez modifier et enregistrer vos scripts de widget et de fournisseur en même temps.

Que faire ensuite

Pour utiliser un fournisseur d’angle avec plusieurs widgets, inscrivez votre fournisseur avec chaque widget et mettez à jour les scripts appropriés.