Angular animation. Почему происходит резкое моментальное изменение высоты, а не плавное?

Question

[Максим]

Привет! В ангуляре и в JS слаб. Не могу понять почему происходит резкое изменение высоты ячейки в таблице. При клике на строку анимируется ангуляр анимацией. Изменяю высоту ячейки и свойство display. Высота меняется, но без плавного перехода. Просто резко открывается и закрывается) А нужно плавно :)
Спасибо :)

animations: [
    trigger('rowVisibleState',
      [
        state('false',
          style({
            height: '0px',
            display: 'none'
          })),
        state('true',
          style({
            height: 'auto',
            display: 'table-cell'
          })),
        transition('0 <=> 1', [
          animate('1000ms ease-in')
        ])
      ]
    )
  ]

Answer 1

[Владимир]

Невозможно анимировать высоту div от величины до auto, должно быть два значения

Comments

[Максим]

Владимир Очень жаль :) Спасибо за ответ :)

Answer 2

[AlexaZem]

Можно менять высоту на auto, только другим способом.
Вот вариант который у меня работает.

state('hidden', style({height: '0px'})),
state('visible', style({height: '*'})),
transition('* => *', animate('255ms ease'))

Comments

[AlexaZem]

В самом css высота не задается.