Angular 2 getting an element ref for function

Question

Can I get the ElementRef from doWidth()?

<div [style.left.px]="doWidth(maybeThisElementRef)">
</div>

Rather than turning the div into a component?

Answer 1

Just use template reference variable like:

<div #el [style.left.px]="doWidth(el)">

See also

• What is #auto attribute here and why it is required

Answer 2

In addition to yurzui's answer, you can also reference it in your components as this:

<div #el [style.left.px]="doWidth()">


  import { ViewChild } from '@angular/core';
  ....
  @ViewChild('el') private el;
  ...
  doWidth(){
    this.el.value="blabla" //or something else 
  }