4

ユーザーがさまざまなアクションから選択できるように、Angular Material で $mdDialog ウィンドウを作成する必要があります。選択したアクションに基づいて、アプリは新しいレポートを生成するか、既存のレポートを読み込むか、ダイアログを完全にキャンセルします。問題は、Angular Material サイトのドキュメントを見ると、confirm $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、回答のためにコードをコピーして申し訳ありませんが、コメントではこれを行うことができませんでした。

Asemの答えには1つ欠けています。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 またはキャンセル以外の応答を取得する方法を確認できます。

于 2016-05-10T13:35:09.487 に答える