Angular - Как определить параметры анимации по умолчанию?

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

Вот что я имею для государства:

state('position', style({ transform: 'translateX({{translate_X}}) translateY({{translate_Y}}) skewX({{skew_X}}) skewY({{skew_Y}})' }))

component.html

<div class="iris" [@move]="{value: triggerValue, params: {translate_X: translate_X, translate_Y: translate_Y, skew_X: skew_X, skew_Y: skew_Y}}"></div>

И вот ошибка, которую мне не удалось решить:

ОШИБКА Ошибка: не удалось создать триггер анимации "перемещение" из-за следующих ошибок: - состояние ("позиция", ...) должно определять значения по умолчанию для всех следующих замен стилей: translate_X, translate_Y, skew_X, skew_Y в InjectableAnimationEngine.AnimationEngine.registerTrigger (...)

Так, где и как мы должны определить значения параметров угловой анимации по умолчанию?

1 ответ

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

{params: {your_variable_name: 'default_value'}}

в вашем состоянии анимации, вот так:

state('in', style({height: '{{maxHeight}}px',}), {params: {maxHeight: '0'}})

Надеюсь, поможет!

Другие вопросы по тегам