Angular 2 html directives and attribute directives

Question

I'm new to Angular 2.

Can someone please explain the difference between the html directives and attribute directives ? Why are they both needed?

Example:

<rating [rate]="rate" (rate-change)="onUpdate($event)"></rating>

So:

rating is what i call "html directive" but I'm not sure what it's for?

[rate] is an attribute directive that sets component property named "rate".

(rate-change) is an attribute directive that calls a component method called rateChange .

Any other types of directives ?

Answer 1

html directives are for managing dom elements like creating elements. attribute directives modify properties of elements. so angular could create several divs, then later change a div's text.