Question

我已经在一台笔记本电脑上开发了Angular 7应用程序，并且可以正常工作。但是，当我尝试使用另一台笔记本电脑进行开发时，它会在浏览器控制台中生成以下错误

Error: Template parse errors:
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("h: 15vw;">

              <a *ngFor="let item of menulist" mat-list-item routerLink="{{ item[3] }}" [ERROR ->][queryParams]="[{rechargeId: '{{ item[0] }}'}]"><mat-icon >dashboard</mat-icon>{{ item[2] }}</a>
    "): ng:///AppModule/AppComponent.html@49:88
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
          <mat-nav-list style="    min-width: 15vw;">

              [ERROR ->]<a *ngFor="let item of menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId"): ng:///AppModule/AppComponent.html@49:14, Directive RouterLinkWithHref
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
          <mat-nav-list style="    min-width: 15vw;">

              [ERROR ->]<a *ngFor="let item of menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId"): ng:///AppModule/AppComponent.html@49:14, Directive RouterLinkWithHref
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
          <mat-nav-list style="    min-width: 15vw;">

              [ERROR ->]<a *ngFor="let item of menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId"): ng:///AppModule/AppComponent.html@49:14, Directive RouterLinkWithHref
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
          <mat-nav-list style="    min-width: 15vw;">

              [ERROR ->]<a *ngFor="let item of menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId"): ng:///AppModule/AppComponent.html@49:14, Directive MatListItem
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
          <mat-nav-list style="    min-width: 15vw;">

              [ERROR ->]<a *ngFor="let item of menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId"): ng:///AppModule/AppComponent.html@49:14, Directive MatListItem
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 (" menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId: '{{ item[0] }}'}]">[ERROR ->]<mat-icon >dashboard</mat-icon>{{ item[2] }}</a>
              
          </mat-nav-list>
"): ng:///AppModule/AppComponent.html@49:136, Directive MatIcon
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 (" menulist" mat-list-item routerLink="{{ item[3] }}" [queryParams]="[{rechargeId: '{{ item[0] }}'}]">[ERROR ->]<mat-icon >dashboard</mat-icon>{{ item[2] }}</a>
              
          </mat-nav-list>
"): ng:///AppModule/AppComponent.html@49:136, Directive MatIcon
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("Link="{{ item[3] }}" [queryParams]="[{rechargeId: '{{ item[0] }}'}]"><mat-icon >dashboard</mat-icon>[ERROR ->]{{ item[2] }}</a>
              
          </mat-nav-list>
"): ng:///AppModule/AppComponent.html@49:167
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
    </mat-sidenav>

    [ERROR ->]<mat-sidenav-content style="height:90vh">
      <router-outlet></router-outlet>
    </mat-sidenav-con"): ng:///AppModule/AppComponent.html@54:4, Directive MatSidenavContent
Parser Error: Got interpolation ({{}}) where expression was expected at column 15 in [[{rechargeId: '{{ item[0] }}'}]] in ng:///AppModule/AppComponent.html@49:88 ("
    </mat-sidenav>

    [ERROR ->]<mat-sidenav-content style="height:90vh">
      <router-outlet></router-outlet>
    </mat-sidenav-con"): ng:///AppModule/AppComponent.html@54:4, Directive MatSidenavContent

我首先卸下了节点模块，然后使用npm install命令重新安装在第二台计算机中。

运行ng serve之后，没有错误或警告。

有人可以解决此问题。

Answer 1

您不需要指令的插值，只需要表达式。在这里，routerLink是指令，因此当您给{{}}（插值）时，会出错。删除这些插值并仅给出一个表达式。

如何解决Anguler 7项目中的插值错误

1 个答案: