Ng-click指示内のスコープ範囲

Question

ローカル変数directiveElementの内部にng-clickメソッドのlinkディレクティブの機能を使用できない理由を説明できますか？あなたはそれを避けることができれば、私はディレクティブ内のCSSルールを適用することはお勧めしません

(function() { 
"use strict"; 

angular 
    .module("app") 
    .directive("cell", ABCDirective); 

function ABCDirective() { 
    return { 
     restrict: 'E', 
     template: '<div><button ng-click="doSomething()">Change background</button></div>', 
     link: function(scope, element) { 
      var directiveElement = element; 

      scope.doSomething = function() { 
       **** Uncaught ReferenceError: directiveElement is not defined(…) **** 
      }; 
     } 
    }; 
} 
})(); 

Answer 1

あなたは、背景色を変更するには、そのような何かを行うことができます。

return { 
      restrict: 'E', 
      template: '<div><button ng-style="{\'background-color\':myColor}" ng-click="doSomething()">Change background</button></div>', 
      link: function(scope, element) { 
       scope.myColor = 'red'; 

       scope.doSomething = function() { 
        scope.myColor = 'blue'; 
       }; 
      } 
     }; 

Answer 2

：

は、ここでは、コードです。代わりに、スタイルシートが適切に色を変更できるようにng-classを設定することをお勧めします。ドキュメントから供給このコード例を見てみましょう、と述べた

：

angular.module('dragModule', []) 
.directive('myDraggable', ['$document', function($document) { 

return { 
link: function(scope, element, attr) { 
    var startX = 0, startY = 0, x = 0, y = 0; 

    element.css({ 
    position: 'relative', 
    border: '1px solid red', 
    backgroundColor: 'lightgrey', 
    cursor: 'pointer' 
    }); 

    element.on('mousedown', function(event) { 
    // Prevent default dragging of selected content 
    event.preventDefault(); 
    startX = event.pageX - x; 
    startY = event.pageY - y; 
    $document.on('mousemove', mousemove); 
    $document.on('mouseup', mouseup); 
    }); 

    function mousemove(event) { 
    y = event.pageY - startY; 
    x = event.pageX - startX; 
    element.css({ 
     top: y + 'px', 
     left: x + 'px' 
    }); 
    } 

    function mouseup() { 
    $document.off('mousemove', mousemove); 
    $document.off('mouseup', mouseup); 
    } 
} 
}; 

}]); 

ソース：未定義の変数についてはhttps://docs.angularjs.org/guide/directive

は、あなたがに関数パラメータを割り当てる必要はありません最初の別の変数。実際にこのエラーを引き起こすコードを投稿できますか？ （コードの代わりにだけではなく、エラーメッセージ）