angular2 引用页面元素@ViewChild和ElementRef

最新推荐文章于 2024-03-26 17:32:25 发布

xlovelace

最新推荐文章于 2024-03-26 17:32:25 发布

阅读量2.7k

点赞数

文章标签： angular2 ViewChild ElementRef

本文介绍了一个使用Angular框架的示例，在该示例中通过`@ViewChild`装饰器获取DOM元素，并在组件初始化完成后修改这些元素的背景颜色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

@Component({
  selector: 'home',
  template: `
    <div>Test</div>
    <input type="text"#testElem>
    <input type="text"#testElem2>
  `
})


export class HomeComponent{

  @ViewChild('testElem') el:ElementRef;
  @ViewChild('testElem2') el2:ElementRef;

  ngAfterViewInit() {
    this.el.nativeElement.style.background = "red";
    this.el.nativeElement.style.background = "blue";
  }

}