angular - Angular 8 如何将 $("#chat_panel").animate({ width: "toggle" }) 转换为打字稿？

Question

我需要将此 jquery 转换为 angular8

$("#chat_panel").animate({ width: "toggle" });

标签： angulartoggleangular-animations

Answer 1

Angular 和 jQuery 的主要区别在于访问 DOM 元素。当 jQuery 使用$符号时，Angular 使用ViewChild. 动画代码应该相同。

import { ViewChild, ElementRef } from '@angular/core';

@Component({
  ...
})
export class YourComponent {

  @ViewChild('#chat_panel') chatPanel: ElementRef;

  animateChatPanel(): void {
     this.chatPanel.nativeElement.animate({
       ... // your animation code here
     }); 
  }
}