# 66 add show-clear option

README.md

@@ -143,7 +143,8 @@ The directive accepts several attributes which are described below:
 | **edit-input**            | Boolean                 | true => Input editable and don't show dialog (default: false)        |
 | **click-outside-to-close**| Boolean                 | true => A click outside close the dialog (default: false)            |
 | **minute-steps**          | Number                  | 1 to 59 minute steps (default: 5)                                    |
-| **show-icon**             | Boolean                 | true => Show calendar or time icon before + clear (default: false)   |
+| **show-icon**             | Boolean                 | true => Show calendar or time icon before (default: false)           |
+| **show-clear**            | Boolean                 | true => clear (default: true if show-icon)                           |
 | **template-url**          | String                  | You can set a custom HTML template (default: '')                     |
 | **ng-model-options**      | timezone option         | For example: ng-model-options="{timezone: 'utc'}"                    |
 | **day-of-week-len**       | Number                  | Day of the week length (default: 1 => S) Possible value 0-3          |
@@ -216,7 +217,8 @@ The `mdcDateTimeDialog.show` accepts almost the same options as the directive.
        editInput: {boolean} =false,
        clickOutsideToClose: {boolean} =false,
        minuteSteps: {int} =5,
-       howIcon: {boolean} =false,
+       showIcon: {boolean} =false,
+       showClear: {boolean} =true,
        templateUrl: {string} =''
        targetEvent: {DOMClickEvent}=null,
        openFrom: {string|Element|object}=null,

index.html

@@ -141,6 +141,17 @@ <h2>Datetime Pickers</h2>
         <div flex-gt-md="grow" ex-source-code target="input"></div>
       </div>
 
+      <div layout-gt-md="row" layout="column" layout-align-gt-md="center center">
+        <md-input-container flex-gt-md="30">
+          <label>Date/Time Picker with no clear</label>
+          <input mdc-datetime-picker date="true" time="true" type="text" id="datetimenoclear"
+                 placeholder="Date" show-todays-date minutes="true"
+                 min-date="date" show-icon="true" show-clear="false"
+                 ng-model="dateTime">
+        </md-input-container>
+        <div flex-gt-md="grow" ex-source-code target="input"></div>
+      </div>
+
       <form name="frm">
         <div layout-gt-md="row" layout="column" layout-align-gt-md="center center">
           <div layout="column" flex-gt-md="30">

js/angular-material-datetimepicker.js

@@ -117,6 +117,7 @@
         clickOutsideToClose: false,
         minuteSteps: 5,
         showIcon: false,
+        showClear: true,
         template: template,
         templateUrl: '',
         targetEvent: null,
@@ -169,6 +170,7 @@
             clickOutsideToClose: '=',
             minuteSteps: '=',
             showIcon: '=',
+            showClear: '=',
             templateUrl: '@',
             dayOfWeekLen: '=',
             hasBackdrop: '='
@@ -296,7 +298,7 @@
                 'ng-click="openCalendarDiag($event)">' +
                 '<md-icon aria-label="md-calendar" md-svg-src="' + (scope.date ? mdCalendar : mdAccesTime) + '"></md-icon>' +
               '</md-button>',
-              clearButton = '<md-button ng-show="currentDate" class="md-icon-button dtp-clear" aria-hidden="true" ng-click="clear()">&#x2715;</md-button>';
+              clearButton = scope.showClear === undefined || scope.showClear ? '<md-button ng-show="currentDate" class="md-icon-button dtp-clear" aria-hidden="true" ng-click="clear()">&#x2715;</md-button>' : '';
               element.after($compile(calendarButton + clearButton)(scope));
 
               scope.openCalendarDiag = function(e) {