Я понимаю, что я могу использовать jQuery для получения ширины элемента, но мне любопытно; есть ли способ сделать это, используя AngularJS?
Как я могу получить ширину элемента с помощью 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);