the scope , element and attrs parameters are defined for your custom directive as described in the documentation here , but you can rename them to your own.
scope : this is the scope of your user directive, similar to $scope in the controller
element : this is an element of your user directive
attrs : this is the set of attributes in your custom directive . (there should be element attributes, thanks @zeroflagL for the fix!)
For example, if you create a custom directive called myDirective , and you are likely to use it in your html particles as follows:
<my-directive num-rows="3"></my-directive>
Here num-rows is an attribute for your directive, and you can get its value in your link function:
function link(scope, element, attrs) { console.log('num-rows:', attrs.numRows); //you can change its value, too attrs.$set('numRows', '10'); //attrs setter //you can watch for its changes to trigger some event attrs.$observe('numRows', function(newVal) { console.log('trigger some event for the changes in numRows here'); }); }
In addition, in the above communication function, you can bind an element / directive to an action:
element.bind('click', function() { console.log('do something with the click event'); });
I suggest you spend some time reading the documentation. The link function can take a 4th parameter, which is the controller of another directive that is required in your custom directive. eg:.
require: '^ngModel' .... function link(scope, element, attrs, ngModelCtrl) { .... }