1回答

接灰的电子产品

2017-10-16

已采纳

Hostbinding 就是把内部的变量或函数绑定到渲染的 HTML 宿主元素上，从而改变其行为。比如 

@HostBinding('class.hover') private ishovering: boolean; 这句就是把宿主元素的 hover 这个样式和成员变量 ishovering 绑定起来，ishovering 如果是 true，就应用这个样式，否就不应用。

当然除了样式，我们还可以绑定其他属性，比如我们做的动画中，我们这么写

@HostBinding('@routeAnim') state: string;

由于动画本身并没有可识别的属性，那么怎样才能让 state 的变化体现到宿主元素呢？这个 `@` 符号其实就是在宿主中创建了一个新的自定义属性 ng-trigger ng-trigger-routeAnim

<app-project-list 
  _nghost-c15="" 
  class="ng-tns-c15-3 
  ng-trigger 
  ng-trigger-routeAnim" 
  style="display: flex; overflow: auto;">
</app-project-list>

0

1

dds813

非常感谢！

2017-10-16

共1条回复