Remove or change the calendar icon from angular material datepicker

Angular Material 1.1.0 has a solution, although it seems undocumented.

From angular-material/modules/js/datepicker/datepicker.js:

* @param {String=} md-hide-icons Determines which datepicker icons should be hidden. Note that this may cause the
* datepicker to not align properly with other components. **Use at your own risk.** Possible values are:
* * `"all"` - Hides all icons.
* * `"calendar"` - Only hides the calendar icon.
* * `"triangle"` - Only hides the triangle icon.

Usage:

<md-datepicker ng-model="myModel" md-hide-icons="calendar"></md-datepicker>

The original question was how to "to change or remove the calendar icon on datepicker directive."?

I just know how to remove it.

You can remove the calendar icon by simply putting the following in a CSS file and adding it to your page:

.md-datepicker-button {
    display: none !important;   
}

.md-datepicker-input-container {
    margin-left: 0 !important;    
}