Safari Support

[ChaunceyHoover]

The field just gets converted to an input[type="time"] field when used on Safari v11, which isn't supported, so it's essentially a text input field.

[johnrix]

Suggest try using https://github.com/dpoetzsch/md-pickers instead, as it is being actively updated, whereas this project appears to be dead.

Also note the following lines in mdpDatePicker.js and mdpTimePicker.js respectively, that govern the input types used for the date and time picker input fields:

        scope.type = scope.dateFormat ? "text" : "date"

        scope.type = scope.timeFormat ? "text" : "time"

Tracing this back, you will find that scope.dateFormat and scope.timeFormat are both assigned from mdp-format attributes provided in the DOM, so if you are specifying this, then you will get a text input field rather than a date or time input.

Lastly, worth noting that the newer fork mentioned above adds locale support, so sensible default date/time formats are used. The upshot though is of course that the fields will generally always end up being 'text' inputs rather than date/time inputs. That's fine if that's what you want, but I personally wanted to retain the browser in-built date picker behaviour also. To do so, I added the following into my controller:

.controller('myCtrl', function($scope, $mdpLocale) {
    // Allow mdp-date-picker elements to use <input type="date" ...> in order to enable browser's own date pickers also where available
    $mdpLocale.date.dateFormat = null; 
    ...
})