web-dev-qa-db-fra.com

Erreur d'analyse: interpolation obtenue ({{}}) où l'expression était attendue

J'utilise ng-bootstrap en remplacement de ui-bootstrap dans angular2.

Mon html est comme suit:

<ul class="list-inline">
    <li class="tag" ngb-dropdown auto-close="outsideClick" 
        *ngFor="let item of ['Elastic Search','Database Theory','CVS'];
        let $index=index;" 
        [ngClass]="{'default-tag': $index==0, 'matched-tag': $index==1, 'unmatched-tag': $index==2 }">
         <a href ngb-dropdown-toggle id="desiredSkill{{$index}}">
             <i class="bi_interface-tick following"></i> {{item}} <i class="bi_interface-more tag-menu-icon"></i>
                            </a>
               <ul class="dropdown-menu tag-menu" ngb-dropdown-menu [aria-labelledby]="desiredSkill{{$index}}">
                     <li><a href>Follow Skill</a></li>
                     <li><a href>Related Jobs</a></li>
                </ul>
     </li>
  </ul>

Mais lorsque j'exécute mon application, le message d'erreur suivant s'affiche:

main.browser.ts: 25Error: Erreurs d’analyse de modèles: Erreur de l'analyseur: Interpolation obtenue ({{}}) où l'expression était attendue à la colonne 12 dans [désirée {{$ index}}] dans JobDescription @ 174: 77 ("] [Aria-labelledby] =" désiréSkill {{$ index}} ">

  • "): JobDescription @ 174: 77 Erreur d’analyseur: jeton inattendu '{' à la colonne 13 dans [désirée {{$ index}}] dans JobDescription @ 174: 77 ("
    ] [aria-labelledby] = "desireSkill {{$ index}}">
  • "): JobDescription @ 174: 77 Impossible de se lier à 'aria-labelledby' car il ne fait pas partie de la propriété connue de 'ul'. (" ] [Aria-labelledby] = "désiréSkill {{ $ index}} ">
  • "): JobDescription @ 174: 77 Erreur d’analyseur: Interpolation obtenue ({{}}) où l’expression était attendue à la colonne 12 dans [désirée {{$ index}}] dans JobDescription @ 174: 77 ("

                    <div class="row">
                      <div class="col-lg-4 col-xs-4" [ERROR ->]*ngFor="let i of [0,1,3]">
                        <img src="http://ecx.images-Amazon.com/images/I/81VFU9"):
    

    JobDescription @ 215: 49 Erreur d'analyse: jeton inattendu '{' à la colonne 13 dans [désiréSkill {{$ index}}] dans JobDescription @ 174: 77 ("

                    <div class="row">
                      <div class="col-lg-4 col-xs-4" [ERROR ->]*ngFor="let i of [0,1,3]">
                        <img src="http://ecx.images-Amazon.com/images/I/81VFU9"):
    

    JobDescription @ 215: 49 Erreur de l'analyseur: Interpolation obtenue ({{}}) où l'expression était attendue à la colonne 12 dans [désiréSkill {{$ index}}] dans JobDescription @ 174: 77 (" ERROR -> =" main.applyJob () "> Postuler à la tâche ERROR -> =" main.applyJob () "> Postuler à la tâche __.] [hidden] = "! ifNotApplied"> Appliqué ] [hidden] = "! ifNotApplied"> Appliqué ] [hidden] = "! ifNotUploaded"> Télécharger le CV ] [hidden] = "! if ifNotUploaded"> Télécharger un CV Des questions sur cet emploi?

    [ERREUR ->] Vous avez des questions sur ce travail?</ p> [ERREUR ->]
  • 17
    Akhilesh Kumar

    Vous ne pouvez pas utiliser l'interpolation dans la liaison de la propriété standart. Il devrait y avoir une expression.

    Semble qu'il devrait être:

    [attr.aria-labelledby]="'desiredSkill' + $index"
    

    ou

    attr.aria-labelledby="desiredSkill{{$index}}"
    
    26
    yurzui

    Je pense que vous avez oublié de déclarerindexofngFor

    *ngFor="let item of ['Elastic Search','Database Theory','CVS'];let $index=index" ...
    

    utiliser aussi,

    [attr.aria-labelledby]="desiredSkill{{$index}}"
    
    2
    micronyks

    Utilisez ceci

      <button class="btn btn-primary" title="Edit" (click)="showEditModal(record.id)"><i class="fa fa-edit"></i></button>
    
    1
    Abdus Salam Azad

    Habituellement, cette erreur se produit lorsque nous essayons d'implémenter une liaison de données d'interpolation et de propriété sur la même propriété HTML.

    Exemple:

    Mauvaise mise en œuvre

    [disabled]= {{isDisabled}}
    

    Mise en œuvre correcte

    disabled= {{isDisabled}}
    

    Remarque: supprimez le crochet de la propriété d'élément html

    0
    Yogesh Aggarwal