Dev Faq
0
votes

Comment utiliser la condition NGIF à l'intérieur de la boucle imbriquée en angulaire

Je veux implémenter un menu côté navigation à l'aide du menu Angular.Navigation contient 3 sous-menus de niveau Ceci est mon code éprouvé xxx

lorsque j'exécute l'erreur suivante arrive

Erreur TypeError: Impossible de lire la propriété 'Longueur' de indéfini

S'il vous plaît, une personne recommande une bonne façon de terminer cela.

3 commentaires

Le menuliste est-il indéfini au début? Essayez d'ajouter une autre condition au * ngif = "Menulist && Menulist.Length> 0" pour vérifier d'abord si cela existe même.

Ajoutez l'opérateur de navigation sécurisé (?.) Menulist? .Lengthlength

Oui. Après ajouter des codes ci-dessus, il n'y a pas d'erreur dans la console. Mais le problème est que le tableau MENU1.SUBMENU a une valeur. mais il exécute le deuxième code .... {{menu1.displaytext}}

3 Réponses :

0
votes

Cette erreur vient lorsque les variables ont une valeur indéfinie.

Modifiez votre code avec ceci: xxx

1 commentaires

ça ne marche pas. Menu1.submenu a des valeurs mais toujours cette ligne est exécutée. {{MENU1.DISPLAYTEXT}}

0
votes 
<div>
  <div class="sidenav" id="divSideNav">
    <div class="logoDiv" id="divLogo">
      <img src="assets/images/logoArch.png" alt="Arch Logo" class="logoSideNav">
    </div>
    <div class="logo-navborder" id="divlogoBorder"></div>
    <a (click)="workClick()" class={{lnkWorkQueue}}  id="lnkWorkQueue">Queue1</a>
    <div class="side-navbarborder" id="divWorkQueueBorder"></div>
    <a (click)="quickQuoteClick()" class={{lnkQuickClick}} id="lnkInitiateRow">Queue2</a>
    <div class="side-navbarborder" id="divInitiateRowBorder"></div>
    <a (click)="fullQuoteClick()" class={{lnkFullClick}} id="lnkInitiateNew">Queue3</a>
    <div class="side-navbarborder" id="divInitiateNewBorder"></div>
    <a (click)="endorsementClick()" class={{lnkRenewClick}} id="lnkEndrose">Queue4</a>
    <div class="side-navbarborder" id="divEndroseBorder"></div>
    <a (click)="renewClick()" class={{lnkLossClick}} id="lnkRenew">Queue5</a>
    <div class="side-navbarborder" id="divRenewBorder"></div>
    <a (click)="lossClick()" class={{lnkReprintClick}} id="lnkLoss">Queue6</a>
    <div class="side-navbarborder" id="divLossBorder"></div>
    <a id="lnkInf" (click)="infCenterClick()" id="lnkInfCenter" class={{lnkInfClick}}>Queue7
      <img src={{arrowImageInf}}>
    </a>
    <div *ngIf="subInfCenter">
      <a class="subMenu">View Form Library</a>
      <a class="subMenu">Classification Guide</a>
      <a class="subMenu">UW Guide</a>
      <a class="subMenu">FAQ</a>
      <a class="subMenu">Contact Center</a>
    </div>
    <div class="side-navbarborder" id="divInfCenterBorder"></div>
    <a id="lnkSup" (click)="supportClick()" id="lnkSupportr" class={{lnkSupportClick}}>Support
      <img src={{arrowImageSup}}>
    </a>
    <div *ngIf="support">
      <a class="subMenu">View Form Library</a>
      <a class="subMenu">Classification Guide</a>
    </div>
    <div class="side-navbarborder" id="divSupportBorder"></div>
  </div>
</div>
0 commentaires
1
votes

Il suffit d'ajouter ? avant toute la longueur comme ?. longueur résoudre votre problème. Merci

2 commentaires

Il fonctionne mais après avoir ajouté la condition NAV BAR COLLAPSPAPE / Développer Ne pas fonctionner

Pouvez-vous créer un violon de travail pour plus de clarification? Merci

Articles qui pourrait vous intéresser :

Impossible d'importer le module "@ angular / material"
Erreur de compilation angulaire: NG6001: la classe est répertoriée dans les déclarations du NgModule 'AppModule', mais n'est pas une directive, un composant ou un tube
erreur NG6002: apparaît dans le NgModule.imports d'AppModule, mais n'a pas pu être résolu en une classe NgModule
[ng update]: Erreur - Le package "@ angular-devkit / schematics" ne peut pas être résolu à partir du répertoire racine de l'espace de travail