角材质mdDialog背景问题

Question

简而言之，对话框具有一个背景（透明的白色背景层），该背景是对话框下方的一个z索引。

第一个对话框的z索引为50，背景为49。第二个对话框顶部的z索引为80，背景为79。

问题是，然后将第一个对话框的z索引更改为80，背景为79。实际上，第二个对话框没有背景。

angular
   .module("MyApp", ["ngMaterial", "ngMessages", "vAccordion"])

   .controller("AppCtrl", AppCtrl);

function AppCtrl($mdDialog) {
   var vm = this;
   vm.detailtemplate = {
      parent: angular.element(document.body)[0],
      fullscreen: true,
      autoWrap: true,
      // skipHide: true,
     // bindToController: false,
      hasBackdrop: true,
      clickOutsideToClose: true,
   };
   vm.openDialog = function() {
      $mdDialog.show(
         Object.assign(vm.detailtemplate, {
            templateUrl: "ethel.htm",
            // template:"<h1>test dialog</h1>",
            controller: AppCtrl2,
            controllerAs: "pec",
            hasBackdrop: true
         })
      );
   };
}

function AppCtrl2($mdDialog) {
   var vm = this;
   vm.detailtemplate = {
      parent: angular.element(document.body)[0],
      // fullscreen: true,
      autoWrap: true,
      // skipHide: true,
      // bindToController: false,
      multiple: true,
      hasBackdrop: true,
      clickOutsideToClose: true,
   };
   vm.openDialog = function() {
      $mdDialog.show(
         Object.assign(vm.detailtemplate, {
            templateUrl: "fred.htm",
            // template:"<h1>test dialog</h1>",

            hasBackdrop: true
         })
      );
   };
}

请参阅858d4284dd32a420f45d2a4cc0f4ff62上David（@StretchKids）的钢笔CodePen。