角材ダイアログモーダルでフォームを使用

Question

角材を使用してモーダルシステムを管理しています。私はフォームをモーダルに入れ、検証後に値を取得します。

これは、単純なモーダルのために私のコードです：

.factory('modalService', ['$mdDialog', function($mdDialog) { 
     var modalService = {}; 
     modalService.alert = function(title, message, ev) { 
     $mdDialog.show(
      $mdDialog.alert() 
      .parent(angular.element(document.querySelector('#popupContainer'))) 
      .clickOutsideToClose(true) 
      .title(title) 
      .textContent(message) 
      .ariaLabel('Alert Dialog Demo') 
      .ok('OK') 
      .targetEvent(ev) 
     ); 
     }; 
     return modalService; 
    }]) 

は、誰もが行う方法を知っていますか？

Answer 1

MdDialogsには、テンプレートとコントローラを接続できます。このコードはあなたが始めなければなりません。

また、「カスタムダイアログ」のデモhereもご覧ください。あなたは完全に合理的であるので、多くのインラインHTMLを、したくない場合にもtemplateUrlオプションを使用して、テンプレートファイルを提供することができます

$mdDialog.show({ 
 
    parent: parentEl, 
 
    targetEvent: $event, 
 
    template: '<md-dialog aria-label="List dialog">' + 
 
    ' <md-dialog-content>' + 
 
    ' <md-list>' + 
 
    '  <md-list-item ng-repeat="item in items">' + 
 
    '  <p>Number {{item}}</p>' + 
 
    '  ' + 
 
    ' </md-list-item></md-list>' + 
 
    ' </md-dialog-content>' + 
 
    ' <md-dialog-actions>' + 
 
    ' <md-button ng-click="closeDialog()" class="md-primary">' + 
 
    '  Close Dialog' + 
 
    ' </md-button>' + 
 
    ' </md-dialog-actions>' + 
 
    '</md-dialog>', 
 
    locals: { 
 
    items: $scope.items 
 
    }, 
 
    controller: DialogController 
 
}); 
 

 
function DialogController($scope, $mdDialog, items) { 
 
    $scope.items = items; 
 
    $scope.closeDialog = function() { 
 
    $mdDialog.hide(); 
 
    } 
 
}

。