opening a mdp-time-picker cause closing of Md-Dialog where it is located

[kuajia]

I am having a problem with a portion of code I wrote... I want to display a dialog which allows the user to modify some hours pamethers. So I used the mdp-time-picker to get and desplay the data. The issue comes when I open the picker, because the open dialog closed immediatly after the picker has displayed. I tried to use the 'multiple' value, like this :

$mdDialog.show({
  controller: DialogController,
  templateUrl: './OrariCounter/modal.html',
  parent: angular.element(document.body),
  targetEvent: ev,
  multiple: true,
  clickOutsideToClose:false,
  fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
});

Has I read in another post of @alenaksu, but this don't solved the problem, probably because I misinterpret the utility of the components.

[Celadora]

The problem occurs because the underlying $mdDialog that is instantiated when mdp-timepicker is built does not have the "multiple: true" option.

The "$mdpTimePicker" provider starts around line 800 in mdPickers.js. Adding the multiple: true option will fix this problem.

module.provider("$mdpTimePicker", function() {
    var LABEL_OK = "OK",
        LABEL_CANCEL = "Cancel";

    this.setOKButtonLabel = function(label) {
        LABEL_OK = label;
    };

    this.setCancelButtonLabel = function(label) {
        LABEL_CANCEL = label;
    };

    this.$get = ["$mdDialog", function($mdDialog) {
        var timePicker = function(time, options) {
            if(!angular.isDate(time)) time = Date.now();
            if (!angular.isObject(options)) options = {};
            return $mdDialog.show({
		multiple: true,
		...

Update: A (possibly) better solution is to configure mdDialog when your application starts so that the "multiple" argument is set to true by default.

module.config(function($provide) {
    $provide.decorator("$mdDialog", function ($delegate) {
      var show = $delegate.show;
      $delegate.show = function decorateDialogShow () {
        var args = angular.extend({}, arguments[0]);
        if(args.multiple === undefined) args.multiple = true;
        return show(args);
      }
      return $delegate;
    });
  })

We hope this helps you!