Angular 8 Ошибка парсера NgClass в начале директивы

Question

Я пытаюсь динамически устанавливать классы с помощью ngClass в angular, используя следующие html

<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",
      },]

Ошибка, которую я получаю при компиляции, выглядит следующим образом Вывод в браузере

Я следил за инструкциями в точности так, как они написаны, однако я не могу найти, почему в шаблоне есть ошибка, описанная выше

Answer 1

Angular парсер шаблонов не поддерживает конечные запятые в шаблонах:

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