角度指令から変数にアクセスする方法は？

Question

このディレクティブは画像に割り当てられ、CropperというjQueryプラグインを使用しています。どのように私は要素の動的変数幅と高さ HTMLまたは別の角度のコントローラで取得することができます：e.widthまたはe.height

.directive("imgcrop", [function ($scope, $controller) { 
     return { 
      restrict: "A", 
      scope: { 
      proposal : "=" 
      }, 
      transclude: true, 
      replace: true, 
      link : function ($scope, $el, $attr) { 
       $attr.$observe("src", function (src) { 
          jQuery('#cropImage').cropper('destroy'); 
          jQuery('#cropImage').cropper({ 
           viewMode  : 0, 
           zoomable  : false, 
           preview: ".extra-preview", 
           dragMode  : 'crop', 
           guides   : true, 
           highlight  : true, 
           cropBoxMovable : true, 
           cropBoxResizable: true, 
           crop   : function (e) { 
            // Output the result data for cropping image. 
            console.log(e.width); 
            console.log(e.height); 
            } 
          }); 

       }); 
      } 
     } 
    } ]); 

Answer 1

セットアップあなたが戻って幅と高さを渡すために使用できる結合範囲をコントローラに送信します。

.directive("imgcrop", [function ($scope, $controller) { 
      return { 
       restrict: "A", 
       scope: { 
       proposal : "=" 
       , croppedWidth: '=' 
       , croppedHeight: '=' 
       }, 
       transclude: true, 
       replace: true, 
       link : function ($scope, $el, $attr) { 
        $attr.$observe("src", function (src) { 
         jQuery('#cropImage').cropper('destroy'); 
         jQuery('#cropImage').cropper({ 
          viewMode  : 0, 
          zoomable  : false, 
          preview: ".extra-preview", 
          dragMode  : 'crop', 
          guides   : true, 
          highlight  : true, 
          cropBoxMovable : true, 
          cropBoxResizable: true, 
          crop   : function (e) { 
           // Output the result data for cropping image. 
           $scope.croppedWidth = e.width; 
           $scope.croppedHeight = e.height; 
          } 
         }); 
        }); 
       } 
      } 
    } ]); 

は、その後、あなたのイメージに：

<img imgcrop croppedWidth="vm.width" croppedHeight="vm.height">