Question

我是角色的新手，想知道我是否可以向目标div添加一个指令，该指针侦听父div的高度/宽度，就像javascript上的onchange事件一样，并调整目标div的高度/宽度相应...

我调查了$ scope.watch并怀疑这是我需要的。

Answer 1

是的，你可以有一个父指令来观察高度/宽度的变化。
然后，from，child指令需要父指令的控制器并观察它。

Html：

<element-parent  height-width>
   <child-element-directive></child-element-directive>
<element-parent>

JS：

 app.directive('heighWidth', function(){

   return {
      scope: {
      },
      controller:function($scope){
         // .......... define setHeight and setWidth
         this.getHeightAndWidth = function(){
           // .......
         }
      },
      link : function(scope, elem, attrs){
          scope.$watch(function(){
             return {height: elem.height(), width: elem.width() };
          }, function(){
             ctrl.setHeight(elem.height());
             ctrl.setWidth(elem.width());
          } , true); // to compare the object value.
      }
   }


})



app.directive('childElementDirective', function(){

   return {
       require: 'heightWidth',
       link: function(scope, elem, attrs, ctrl){
          scope.$watch(
             function(){ 
                 return ctrl.getHeightAndWidth();
             },
             function(heightAndWidth){
                 // ........   
             }, 
             true
          )
       }
   }

})

AngularJS指令监视父级高度的变化

1 个答案: