Angular5动画为什么没有过渡时间呢？

Question

1.Angular5动画设置animate过渡时间之后没有作用
2.代码：

import { Component } from '@angular/core';
import { OverlayContainer } from '@angular/cdk/overlay';
import { trigger, state, transition, style, animate, keyframes } from '@angular/animations';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';

animations: [trigger(

  'openClose',
  [
    state('collapsed, void', style({height: '0px', color: 'maroon', borderColor: 'maroon'})),
    state('expanded', style({height: '*', borderColor: 'green', color: 'green'})),
    transition(
        'collapsed <=> expanded', [animate(500, style({height: '250px'})), animate(500)])
  ])],
  
   constructor() {
    this.collapse();
  }
  expand() { this.stateExpression = 'expanded'; }
  collapse() { this.stateExpression = 'collapsed'; }

3 有效果却没有动画显示，不管给500还是5000一样，这是为什么？