컴포넌트 클래스의 템플릿 참조 변수에 액세스합니다.

컴포넌트 클래스의 템플릿 참조 변수에 액세스합니다.

<div>
   <input #ipt type="text"/>
</div>

컴포넌트 클래스에서 템플릿액세스 변수에 액세스 할 수 있습니까?

즉, 여기서 접속할 수 있나요?

class XComponent{
   somefunction(){
       //Can I access #ipt here?
   }
}

그것은 의 사용 사례입니다.@ViewChild:

https://angular.io/docs/ts/latest/api/core/index/ViewChild-decorator.html

class XComponent {
   @ViewChild('ipt', { static: true }) input: ElementRef;

   ngAfterViewInit() {
      // this.input is NOW valid !!
   }

   somefunction() {
       this.input.nativeElement......
   }
}

여기 작업 데모가 있습니다.

https://stackblitz.com/edit/angular-viewchilddemo?file=src%2Fapp%2Fapp.component.ts

@ViewChild('modal reference variable', { static: true }) name: ElementRef;

모달에서는 안 될 때도 있어요그래서 모달 앵글을 썼을 때 에러가 나서 이걸 씁니다.

@ViewChild('modal reference variable', { static: true }) name!: ElementRef;

버튼을 클릭하지 않고 modal을 실행하고 싶을 때는 반드시 동작합니다.

언급URL : https://stackoverflow.com/questions/39631594/access-template-reference-variables-from-component-class