javascript - Angular directive bind to height of element -

i new angular , want able bind height of element. in current case want bind css bottom on el1 height of el2. not share common controller. how can this?

<div id='el1' ng-controller='controller1' style='bottom: {{theheightofel2}}'></div> <div id='el2' ng-controller='controller2' style='height: 573px;'></div> 

i found answer on here looked promising couldnt see how extend allow me specify element wanted bind to.

in generic case, guess asking directive bind property x on element 1 property y on element 2.

update

i have created directive isn't quite working yet. fires correctly @ start when try test manually updating css of el2 watch doesnt fire

m.directive('bindtoheight', function ($window) {     return {         restrict: 'a',         link: function (scope, elem, attrs) {             var attributes = scope.$eval(attrs['bindtoheight']);             var targetelem = angular.element(document.queryselector(attributes[1]));              // watch changes             scope.$watch(function () {                 return targetelem.height();             },             function (newvalue, oldvalue) {                 if (newvalue != oldvalue) {                     // ...                     console.log('setting bottom ' + newvalue);                     elem.attr('bottom', newvalue);                 }             });         }     }; }); 

to looking answer, here used

usage bind-to-height="[cssproperty, sourceelement]":

<div bind-to-height="['bottom','#addressbookquicklinks']"> 

code:

m.directive('bindtoheight', function ($window) {      return {         restrict: 'a',          link: function (scope, elem, attrs) {             var attributes = scope.$eval(attrs['bindtoheight']);             var targetelem = angular.element(document.queryselector(attributes[1]));              // watch changes             scope.$watch(function () {                 return targetelem.height();             },             function (newvalue, oldvalue) {                 if (newvalue != oldvalue) {                     elem.css(attributes[0], newvalue);                 }             });         }     }; });