Angular 子动画上的角度动画未转换

我有一个嵌套在父动画中的子动画。父动画阻止子动画转换。更改已触发，但没有转换。如何实现此转换并同时触发两个动画

动画.ts

import {
  trigger,
  style,
  transition,
  animate,
  state
} from "@angular/animations";

export const Animations = {
  animations: [
    trigger('expansionTrigger', [
      state('true', style({
        height: '*'
      })),
      state('false',  style({
        height: 0
      })),
      transition('false <=> true', animate(3000))
    ]),
    trigger('colExpansion', [
      state('true', style({
        "-webkit-box-flex": "0",
        flex: "0 0 66.66667%",
        "max-width": "66.66667%"
      })),
      state('false',  style({
        "flex-basis": "0",
        "-webkit-box-flex": "1",
        "flex-grow": "1",
        "max-width": "100%"
      })),
      transition('false <=> true', animate(3000))
    ])
  ]
};

导入{
触发
风格
过渡，
使有生气
状态
}从“@角度/动画”；
导出常量动画={
动画：[
触发器（'expansionTrigger'[
状态（'true'，样式({
高度：'*'
})),
状态（'false'，样式({
身高：0
})),
过渡（'false-true'，动画（3000））
]),
触发器（'colExpansion'[
状态（'true'，样式({
“-webkit box flex”：“0”，
弹性：“0.66.66667%”，
“最大宽度”：“66.667%”
})),
状态（'false'，样式({
“弹性基础”：“0”，
“-webkit box flex”：“1”，
“弹性增长”：“1”，
“最大宽度”：“100%”
})),
过渡（'false-true'，动画（3000））
])
]
};

content.component.html

<div [@expansionTrigger]="isExpanded === 'true' ? 'true' : 'false'">
 <div [@colExpansion]="isExpanded === 'true' ? 'true' : 'false'"></div>
</div>