角度2最好的方式来不断更新dom位置

Question

我正在Angular（v4）中构建游戏，并且我完全意识到直接dom操作很少（如果有的话）正确的角度路径。但是，对于我正在建设的内容，我不确定我是否会看到另一条可行的途径。

我需要的是一个通过同时更新几个元素的旋转位置来处理它的组件（想想太阳系模型）。我看到有两条主要路线，第一条是直接dom操作，可以更新组件输入更改。第二个是具有内联样式标记的组件，例如[style.whatever]="thing.whatever"。

我的第二条路线似乎有点像直接dom操纵，只是不在javascript中。

我喜欢尽可能以“正确”的方式做事，所以任何输入都会有所帮助。

我不会在这个项目中使用/计划/想要使用JQuery。

更新

刚刚意识到我是一个白痴，我不需要程序化的DOM更新，我只需要为我需要启动的地方设置初始css属性，以及动画速度。因为它是一个不变的东西，有了可预测的动画，我可以让css做所有的工作。我仍然想知道在代码中设置这些css属性或作为组件的属性是否最合适。

Answer 1

在这里我很快就想到你能做什么（当然不全面）

使用绑定，例如：

 @HostBinding('style.whatever')
   whatever: thing


  @HostListener('window:resize', ['$event'])
  setHeight() {
    this.height = 200px;
  }

模板变量

@ViewChild('input') input: ElementRef;
<input #input ...>