如何使用Angular2动画更改flex-layout？

在官方教程的帮助下，我在@ angular / animations中完成了我的第一步 . 我添加了需要的库，我创建了我的第一个动画 . 我已经知道过渡和状态是什么 . 我可以创建简单的动画（更改背景颜色和更改元素的大小 .

我在我的项目中使用@ angular / flex-layout库来创建整洁的页面布局 . 这里有一个问题： How can I animate increasing and decreasing width of elements my flex layout? 例如：

我的页面上有3个“列”：

• 在 first state 中，它们的宽度为：38％，52％，10％的容器

• 和 second state 的宽度为：50％，25％，25％

就像在图片中一样（这些是其他州的相同列）

问题：如何转换为更改列宽度的动画？我可以使用哪些方法和属性？代码应该是什么样的？

=====

@编辑：

我发布了我的HTML代码片段，以显示我想要更改的属性（ fxFlex ）

app.component.html

<div class="flex-container"
    fxLayout="row"
    fxLayout.xs="column"
    fxLayoutAlign="end none"
    fxLayoutAlign.xs="end none" class="container-style">

    <!-- first column -->
    <div class="flex-item" fxFlex="38%" fxShow.xs="false" class="one" [@oneState]="state"></div>

    <!-- second column -->
    <div class="flex-item" fxFlex="52%" class="two" [@twoState]="state"></div>

    <!-- third column -->
    <div class="flex-item" fxFlex class="three"></div>
</div>

为 app.component.ts

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  animations: [
    trigger('oneState', [
      state('inactive', style({
        //I have no idea what I should use to change fxFlex attribute!
        //Style? Maybe, something else?
      })),
      state('active',   style({
        //I have no idea...
      })),
      transition('inactive => active', animate('100ms ease-in')),
      transition('active => inactive', animate('100ms ease-out'))
    ]),
    trigger('twoState', [
      state('inactive', style({
        //I have no idea what I should use to change fxFlex attribute!
        //Style? Maybe, something else?
      })),
      state('active',   style({
        //I have no idea...
      })),
      transition('inactive => active', animate('100ms ease-in')),
      transition('active => inactive', animate('100ms ease-out'))
    ]),
  ]
})
export class AppComponent {
  title = 'app works!';

  state: string = 'inactive';

  toggleMove() {
    this.state = (this.state === 'inactive' ? 'active' : 'inactive');
    console.log(this.state);
  }

}

我知道我可以用简单的方式改变div的样式 . 但是我 don't want to change style . 我想 change a fxFlex attribute 的元素 .

有人可以帮帮我吗？可能吗？？