Hey kartik,
As you use the term inheritance so its common that some class use the property of other class.
If you want the difference between controller inheritance and directive inheritance you can first refer to my controller inheritance explanation.
so, Directive inheritance also use the same concept of controller inheritance but the only difference is that we can explicitly allow the parent scope data to be inherited to its child scope.
Now. the question arise how can we have option to inherit data from parent scope? For this let us consider a sample piece of code as example is best way to explain!!
html code
<body ng-app="app">
<div id='div1' ng-controller="sample">
a={{a}}, b={{b}}
<div message></div>
</div>
</body>
Here, the controller sample has a directive contain in it named as "message". The directive is defined as under:
Directive code
app.directive('message',function(){
return{
templateUrl:'info_msg.htm'
scope:true
}
}
We can see from above code that we use extra parameter called "scope:true" which enable the directive named message to inherit data from its parent scope.
However ,if we use Scope:false then the directive message having created its own scope under its parent scope but doesn't inherit any data from its parent.
If there is any change in the child scope those are not reflected in the parent scope. To do this we can use the same method $parent.data=New_value(same as controller inheritance).