4

我必须在 Angular Material 中构建一个 $mdDialog 窗口，以便用户可以从不同的操作中进行选择。根据所选操作，应用程序将生成新报告或加载现有报告，或完全取消对话框。问题在于，如果您查看 Angular Material 站点上的文档（我附上了带有该站点演示代码片段的打印屏幕），那么确认 $mdDialog 仅内置了 .ok 选项和 .cancel 选项。

$mdDialog 确认演示代码

所以现在我的问题是：如何向我的 $mdDialog 窗口添加多个操作选项。另外，如何将功能与控制器中的这些选项联系起来？例如，如果您选择“生成新报告”，则会触发某个服务，但如果您选择“显示以前的报告”，则会触发另一个服务。抱歉，如果这是一个初学者问题，但我觉得我再次没有完全掌握要在这种情况下应用的正确 AngularJS 逻辑。

4

2 回答 2

4

您可以为确认对话框使用自定义模板。

var confirm = $mdDialog.confirm({
      controller: DialogController,
      templateUrl: 'dialog1.tmpl.html',
      parent: angular.element(document.body),
      targetEvent: ev,
    })
    $mdDialog.show(confirm).then(function() {
      $scope.status = 'Confirm resolved';
      $scope.codeRunningBeforeResolve = 'code only runs after resolve';
    });

密码笔

于 2016-05-10T13:01:53.763 回答
1

@Aseem，很抱歉复制您的代码以获得答案，但我无法在评论中执行此操作。

Aseem的回答缺少一件事。如果向 then 函数添加参数，它将接收用户单击的按钮的标题。因此，如果我们稍微修改一下：

var confirm = $mdDialog.confirm({
  controller: DialogController,
  templateUrl: 'dialog1.tmpl.html',
  parent: angular.element(document.body),
  targetEvent: ev,
})
$mdDialog.show(confirm).then(function(answer) {
  $scope.status = answer;
  $scope.codeRunningBeforeResolve = 'code only runs after resolve';
});

您可以看到如何处理多个按钮并获得响应，而不仅仅是 OK 或 Cancel。

于 2016-05-10T13:35:09.487 回答