angular - Angular 4.2 - アニメーション入力パラメーターの使用 - アニメーションの終了状態を維持する方法

Question

バージョン 4.2 より前 (現時点では RC) では、ズームアニメーション用に次のコードを使用していました。

export const magnifyAnimation = trigger('magnify', [
    state('default', style({
        'transform': 'scale(1)'
    })),
    state('magnified', style({
        'transform': 'scale(1.3)'
    })),
    transition('default <=> magnified', [
        animate('430ms ease-out')
    ])
]);

現在、4.2 は入力パラメーターをサポートしているので (これを長い間待っていました)、次のようにします。

component code:

<button
    [@magnify]="{ value: state, params: { scaleFactor: '1.3' }}"
    (mouseenter)="state = 'magnified'"
    (mouseleave)="state = 'default'">
        Hover me
</button>

アニメーションコードは次のように変更されました。

const zoomEffect = animation([
    animate('430ms ease-out', style({
        'transform': 'scale({{scaleFactor}})'
    }))
], { params: { scaleFactor: '1' } });

export const magnifyAnimation = trigger('magnify', [
    transition('default => magnified', useAnimation(zoomEffect), { params: { scaleFactor: '1.3' } }),
    transition('magnified => default', useAnimation(zoomEffect), { params: { scaleFactor: '1' } })
]);

しかし、アニメーション コードの状態で定義されたスタイルがない場合、アニメーションが終了した後、要素 (この場合はボタン) は常に自然なサイズにジャンプします。そして、state() コード ブロックで入力パラメータを指定する方法がわかりません。

私もこれを試しました：

state('magnified', style({
    'transform': '*'
}))

アニメーションの最後に変換の値が保持されることを望んでいましたが、何も達成されません...