Как я могу получить ширину элемента с помощью AngularJS?

Ответ 1

Native JS (#id):

document.getElementById(id).clientWidth;

Native JS (querySelector (селектор класса, id, css3)):

document.querySelectorAll(".class")[0].clientWidth;

Вставьте это в angular.element:

angular.element(document.getElementById(id)).clientWidth;
angular.element(document.querySelectorAll(".class")[0]).clientWidth;

Если вам нужно получить не округленные числа, используйте getBoundingClientRect.

angular.element(document.getElementById(id)).getBoundingClientRect();

Некоторые ресурсы по теме:

• http://msdn.microsoft.com/en-us/library/hh781509(VS.85).aspx
• https://developer.mozilla.org/en-US/docs/Web/API/Element.clientWidth
• https://developer.mozilla.org/en-US/docs/Web/API/element.getBoundingClientRect

Если это плавает на вашей лодке с точки зрения синтаксиса и нет необходимости подключать jQuery в микс, будьте осторожны с азартным брандмауэром.

Ответ 2

Если вы почесали свою голову, как я, со всеми этими предложениями, и они не работают, я обнаружил, что мне нужно установить тайм-аут. Я не уверен, почему, может быть, потому, что я использую атрибуты материального дизайна для своих div.

setTimeout(function(){
     var divsize = angular.element(document.getElementById('fun_div')).prop('offsetWidth');   
     console.log('Width of fun_div: ' + divsize);
    },50);