角指令$表兄妹高度變化

Question

我想監聽同級元素的高度變化，但到目前爲止，我不能得到這個工作..... element[0].nextElementSibling.clientHeight返回初始化時，但不更新正確的值。 ...

(function() { 
    'use strict'; 
    angular.module('someApp').directive('heightdir', function($window) { 
    return { 
     link: function(scope, element) { 

     // Adjust height. 
     scope.calcCommentsHeight = function() { 
      var _h; 
      if ($window.innerWidth > 768) { 
      _h = $window.innerHeight - 222 - element[0].nextElementSibling.clientHeight; 
      $(element).css('height', _h + 'px'); 
      } 
     }; 

     // Sibling height change. 
     scope.$watch((function() { 
      return element[0].nextElementSibling.clientHeight; 
     }), (function(newValue, oldValue) { 
      if (newValue !== oldValue) { 
      console.log(newValue); 
      } 
     }), true); 

     // window resize. 
     angular.element($window).bind('resize', function() { 
      scope.calcCommentsHeight(); 
     }); 

     // Init. 
     scope.calcCommentsHeight(); 
     } 
    }; 
    }); 

}).call(this); 

Answer 1

一個選項：創建一個服務來存儲一個元素值，然後在第二個元素上讀取該服務。

angular.module('whatever.module', []).service('ElementHeight', function() { 
    var height = 0; 
    return { 
     height: function() { return height; }, 
     setHeight: function(newHeight) { height = newHeight } 
    } 
}); 

僞代碼示例：

function ThisController(ElementHeight) { 
    // set it to the height of the element, how depends on what you're doing. 
    ElementHeight.setHeight(999,999); 

    // to get the height 
    newHeight = ElementHeight.height; 
}