2016-10-20 4 views
0

Я новичок в angularJS и пытаюсь найти высоту дочернего div из родительского div.I хочу сделать это без jquery. Я попробовал много решений отсюда, но не из них работал на меня.set высота ребенка div в AngularJS

У меня есть еще одно сомнение: в jquery мы можем использовать $ (". Class"). Height() и $ (". Class"). Css ("value"), как этот angularJS предоставляет любую возможность установить свойства родительского и дочернего div.

здесь я использую понятие директивы, чтобы установить эти вещи,

Код

myApp.directive('orientable', function() {  
return { 
    restrict: 'A', 
    link: function(scope, element, attrs, controller) { 

      //this both will work fine 
      alert(element.children()[0].offsetHeight); 
      alert(element.children()[1].offsetHeight); 

      debugger; 

      element.children()[0].height(); 
      //Uncaught TypeError: element.children(...)[0].height is not a function(…) 

      //this bellow code is showing the error 
      element.children()[0].css('height','250px'); 
     //Uncaught TypeError: element.children(...)[0].css is not a function(…) 


    } 
} 
}); 

<div orientable class=main ng-app="myApp"> 
    <div class=ele1> </div> 
    <div class=ele2> </div> 
     <div class=ele3> </div> 
</div> 

Fiddile

ответ

1

Я не Угловой парень, но попробовать это

var myApp = angular.module('myApp', []); 

myApp.directive('orientable', function() {  
    return { 
     restrict: 'A', 
     link: function(scope, element, attrs, controller) { 

       alert(element.children()[0].offsetHeight); 
       alert(element.children()[1].offsetHeight); 

       element.children()[0].clientHeight; 
       element.children()[0].style.height="250px"; 


     } 
    } 
}); 

css() и height() являются вещами из JQuery.

Для высоты() вы можете использовать clientHeight - это будет включать и дополнять, для css вы можете пойти с style.height.

1

С element.children()[0].height(); вы используете JQuery, потому что height() типичная функция JQuery.

Замените его на element.children()[0].clientHeight, и вам должно быть хорошо. Помните, что javascript предоставляет различные функции для получения высоты элемента:

clientHeight включает в себя высоту и вертикальную прокладку вашего элемента.

offsetHeight включает в себя высоту, вертикальную прокладку и вертикальные границы вашего элемента.

+0

который (клиентHeight or offsetHeight) равен .hight() jquery – user3501613

1

При доступе к элементу, например element.children()[0], вы получаете доступ к необработанному элементу DOM, который не имеет методов css/height, поскольку они поступают из jquery.

Вы можете установить высоту таким образом, вместо того, чтобы element.children()[0].style.height = "200px"

+0

спасибо ... он отлично работает ... – user3501613

Смежные вопросы