Problèmes de personnalisation

Problèmes courants rencontrés lors de la personnalisation d'une application fournie par un portlet dans une instance de développement locale

Problème

Lorsque vous étendez un portlet fourni par une application, vous pouvez être confronté à l'un des problèmes suivants avec le portlet personnalisé dans l'environnement de développement local.

• Le portlet étendu apparaît vide.
• L'étiquette personnalisée que vous avez ajoutée est mal affichée.
• Les étiquettes des lots fournies par l'application et ajoutées précédemment sont mal affichées.

Vous rencontrez ces problèmes si vous implémentez partiellement ou incorrectement les étapes de personnalisation fournies dans Modification des portlets fournis par l'application.

La solution

• Pour le problème de la portlet étendue qui apparaît vide, effectuez les étapes suivantes :
  1. Vérifiez si le nom de la classe du composant de la portlet est mis à jour dans le fichier component.ts de la portlet concernée et transmis dans les variables portletname et componentName. Pour plus d'informations, reportez-vous à l'étape 2 de la section Modification des portlets fournis par l'application.
     L'exemple de code suivant explique comment étendre le portlet Commande de colis :

     export class PackOrderPortletExtnComponent implements OnInit, OnDestroy {
     public static portletname = 'PackOrderPortletExtnComponent';
     public static componentName = 'PackOrderPortletExtnComponent'; }
     

  2. Importez le nom de la classe du composant de portlet mis à jour dans le fichier app.module.ts. Pour plus d'informations, reportez-vous à l'étape 3 de la section Modification des portlets fournis par l'application.
     L'extrait de code suivant explique comment importer le nom de la classe du portlet mis à jour :

     import { PackOrderPortletExtnComponent } from './components/pack-order-portlet/pack-order-portlet.component' 
     export const customComponentDeclarations = [PackOrderPortletExtnComponent];

  3. Ajoutez extensionType:CODE dans le fichier isf-persona-config.json pour remplir le portlet. Dans le cas contraire, le portlet étendu apparaît vide. Pour plus d'informations, reportez-vous à l'étape 4 de la section Modification des portlets fournis par l'application.
• L'étiquette de la liasse personnalisée que vous avez ajoutée n'est pas affichée correctement.

  Considérons une entrée de la liasse d'étiquettes qui est ajoutée au fichier json correspondant. Pour plus d'informations, consultez la section Étapes suivantes dans Modification des portlets fournis par l'application.

  Voici un exemple d'extrait pour /extensions/features/override-component/src/assets/override-component/i18n/en.json.

  {
                  "packPortletExtn":{
                  "LABEL_Select":"Select"
                    }
   }

  L'entrée correspondante est ajoutée au composant HTML de la portlet. Au lieu de l'étiquette proprement dite, le packPortletExtn.LABEL_Select est affiché dans l'application.
  L'exemple de code est le suivant.

  <span class="mx-2" >packPortletExtn.LABEL_Select</span>

  Pour résoudre le problème, ajoutez l'attribut translate dans la balise HTML du composant de la portlet, comme illustré.

  <span class="mx-2" translate>packPortletExtn.LABEL_Select</span>

• Les étiquettes de liasses fournies par l'application et ajoutées précédemment sont affichées de manière incorrecte.
  Assurez-vous que la variable statique bundles dans la app.module.ts contient les actifs qui sont chargés à partir de l'application d'origine. Pour plus d'informations, consultez la section Étapes suivantes dans Modification des portlets fournis par l'application. Ajoutez l'exemple d'entrée suivant :

  {
         prefix: './assets/home/i18n/',
         suffix: '.json'
  }