CODEWITHSUNDEEP
domangular
jackBot
jackBot

Reputation: 51

Angular2: Get dimensions of DOM-Element (without ElementRef)

I try to get dimensions of a DOM-Element (heigtht/width). As for security reasons (see https://angular.io/docs/ts/latest/guide/security.html) I don't want to directly acccess the DOM.

Does anyone have some other Idea?

Upvotes: 3

Views: 2381

Answers (2)

jackBot
jackBot

Reputation: 51

As I thought more about my Question:

Actually accessing the DOM-Element through ElementRef is no security threat in this case, as no (unsafe-)data is injected through it.

If you want to get around using ElementRef (eg. for server side rendering) and want to manipulate a DOM-Element I recommend to look at the Renderer class.

Upvotes: 1

koningdavid
koningdavid

Reputation: 8085

You could do it like this

import { Component } from '@angular/core';

@Component({
  selector: 'my-selector',
  template: '<div #myDiv (click)=getElementDimensions(myDiv)>Hello</div>'
})
export class AboutComponent {

  constructor() { }

  getElementDimensions(el: HTMLDivElement) {
    console.log(el.getBoundingClientRect())
  }

}

Upvotes: 2

Related Questions