angular - 向宿主元素添加 Angular 动画

Question

我通过

给主机添加了一个动画

@Component({
   ....,
   animations: [
      trigger('slideIn', [
          ...
      ])
   ],
   host: {
      '[@animation]': 'condition'
   }
}

效果很好，在编译时我被告知这已被弃用，我应该使用 @HostBinding ...

@HostBinding('[@animation]') get slideIn() {
   return condition;
}

这会抛出一个错误

Can't bind to '[@animation' since it isn't a known property of 'my-component-selector'.

但我无法将动画添加到我的模块中。我该怎么办？

Answer 1

@HostBinding() 不需要方括号

@HostBinding('@slideIn') get slideIn() {

有两个装饰器 @HostBinding() 和 @HostListener() 因此 () 和 [] 不是必需的，而当使用 host: [...] 时才是必需的。