Estoy usando el componente Diálogo de Primeng y quería agregar una animación para aumentar su escala cuando se abre.

Agregar una animación de activación a mi componente funciona y el estilo CSS cambia en el DOM pero el cuadro de diálogo no cambia. Supongo que es porque p-dialog es solo el selector, ¿cómo puedo aplicarlo para el div debajo de él?

 trigger('expandBox', [ state('inactive', style({ transform: 'scale(1)', })), state('active', style({ transform: 'scale(2)', })), transition('inactive => active', animate('100ms ease-in')), transition('active => inactive', animate('100ms ease-out')) ]) <p-dialog [@expandBox]='dialogVisibleString' header="Meeting Details - {{tileday}}" ... </p-dialog>

Tuve este problema en el pase en el que quería agregar animaciones a un componente de terceros y nunca estuve seguro de cómo solucionarlo.