angular - 如何禁用 Angular 2 动画以使用 Protractor 进行测试？

Question

我几乎找不到任何相关信息。谷歌上出现的几乎所有内容都是关于 Angular 1 的，而我发现的关于 Angular 2 的内容不起作用(http://www.talkinghightech.com/en/angular-2-end-2-end-testing/)。

我正在寻找一种方法来禁用 CSS 动画和我的 angular 2 组件上的动画。

Answer 1

现在this bug关闭时，您可以使用名为 @.disabled 的特殊绑定(bind)来禁用子动画。它既可以应用于本地组件，也可以应用于整个应用程序。

这是他们的代码文档中的引述:

@Component({
  selector: 'my-component',
  template: 
    <div [@.disabled]="isDisabled">
      <div [@childAnimation]="exp"></div>
    </div>
  animations: [
    trigger("childAnimation", [
      //...
    ])
  ]
})

class MyComponent {
  isDisabled = true;
  exp = '...';
}

或应用范围内:

import {Component, HostBinding} from '@angular/core';

@Component({
  selector: 'app-component',
  templateUrl: 'app.component.html',
})
class AppComponent {
  @HostBinding('@.disabled')
  public animationsDisabled = true;
}

希望对您有所帮助!