ElementRef has no instance of style

Issue

I was writing up some code which was going to update the position of a div with dart.

So, what i was coming up with something like, on mouse down on a div, start updating the position of the element.

The html will be as follows:

<div (mousedown)="mouseDownFunction($event)"></div>
<div #selection></div>

with the dart looking like:

@ViewChild("selection")
DivElement selectionDiv;

mouseDownFunction(mouse){
  selectionDiv.style.left = "${mouse.position.left}px";
}

and when this happens, it tries to call style on selectionDiv, but says that ElementRef has no instance of style.

enter image description here

Solution

This is expected functionality. selectionDiv isn’t a DivElement, but an ElementRef. To get the dart:html element, use the getter selectionDiv.nativeElement.
Hope this helps.

Answered By – Tobe Osakwe

Answer Checked By – Mildred Charles (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.