首页 > 解决方案 > 指令开头的Angular 8 NgClass解析器错误

问题描述

我尝试使用以下html动态设置具有角度的ngClass类

<div class="col-md-6 col-lg-4 col-xl-4" *ngFor="let caso of tareas">
      <div  [ngClass]="{
         'card card-outline-info shadow-box':caso.prioridad=== 'baja',
         'card card-outline-warning shadow-box':caso.prioridad=== 'importante',
          'card card-outline-success shadow-box':caso.prioridad=== 'completado',
          'card card-outline-danger shadow-box':caso.prioridad=== 'urgente',
          }"> 
 </div>
</div>

TS:

tareas:Tarea[] =[
      {
         prioridad:"baja",
         tipo:"Proyecto",
         nombre :"Migración",
         descripcion :"descripcion 1",

      },
      {
         prioridad:"urgente",
         tipo:"Caso",
         nombre :"Falla en acceso a DB2",
         descripcion :"descripcion 2",
      },
      {
         prioridad:"importante",
         tipo:"Proyecto",
         nombre :"Implementar WebSphere",
         descripcion :"descripcion 3",
      },
      {
         prioridad:"completado",
         tipo:"Caso",
         nombre :"caso alv",
         descripcion :"descripcion 5",
      },]

我在编译时得到的错误如下 浏览器输出

我完全按照教程的编写方式进行了操作,但是我找不到模板为什么会出现上述错误的原因

标签: angulartypescript

解决方案


Angular 模板解析器不支持模板中的尾随逗号:

'card card-outline-danger shadow-box':caso.prioridad=== 'urgente',
}"                                                              ^^^^
                                                         remove this

推荐阅读