Angular material 角形材质：如何在屏幕上显示一个又一个烤面包片，同时保持两个烤面包片都在屏幕上？

我正在使用$mdToast（Angular Material framework）指令在我的Angular（-Material）web应用程序中显示几个状态消息

当用户登录时，如果登录成功，则通过调用以下命令显示toast：

     $scope.showToastMessage = function() {
         var toast = $mdToast.simple()
             .content("Login successful);
             .action('OK')
             .highlightAction(false)
             .position($scope.getToastPosition());
          $mdToast.show(toast).then(function(toast) {
                //...
             }
         }); 
     };

登录成功后，我需要进行另一次检查（例如有效会话cookie），并在不覆盖前一条消息的情况下显示另一条toast消息，并且在实际显示前一条消息后显示

我在这里遇到的问题是：

• 第二个吐司显示在新吐司之前（可能是由于$mdTost的异步性质）
• 第二个烤面包片显示不到一秒钟，然后消失只在屏幕上留下第一个烤面包片（基本上，第二个烤面包片先显示，然后在第一个烤面包片出现时隐藏）

解决方案可以是：

• 在内部创建第二个吐司，然后。然后回调：这也不起作用，因为需要用户按“确定”操作按钮进行干预
• 调用$mdToast.updateContent（）（$mdToast）将覆盖以前的toast消息（这不是最好的解决方案，但也可以），但我不知道如何：
  （1） 选择屏幕上显示的特定祝酒词（假设我有几个祝酒词通过不同的呼叫显示），然后
  （2） 延迟一段时间（比如说3秒）后更新toast消息，以便向用户显示登录成功，但还有一些其他信息

---

有什么线索吗？

我不确定你是否想同时举杯。如果您想按顺序显示，您可以将第二个toast调用放入，因为该操作（OK）解决了第一个toast的承诺。这就是我尝试过的：

    var toast = $mdToast.simple()
      .content('top left')
      .action('OK')
      .highlightAction(false)
      .position($scope.getToastPosition());
    var toast2 = $mdToast.simple()
      .content('Checking some other things')
      .highlightAction(false)
      .position('top left');


    $mdToast.show(toast).then(function() {
       $mdToast.show(toast2);
    });

---

见此。

设计规范不鼓励同时举行多场祝酒会。