将指令传递给Angular Material mdPanel服务

Question

我正在尝试利用mdPanel服务(Angular Material框架的一部分)为我的应用程序创建弹出窗口.我能够使服务工作,但有一个想法将指令传递给服务,这样我就可以拥有一个可以显示的动态表单元素.但是,经过广泛阅读文档和一些谷歌搜索后,我似乎无法找到实现这一目标的可行方法.

我对Angular有些新意,所以如果这是不言自明的,我会道歉.感谢您提供的任何见解.

Answer 1

传入表单指令作为模板。所以如果你创建了这样的指令

angular.module('myApp')
.directive('myAwesomeFormDirective', [function() {
    return {           
        templateUrl: 'some/path/some.html',
        controller: "SomeFormController"
    };
}])

您的 mdPanel 配置选项将如下所示。您可以随意配置其他选项，但是，“模板”应设置为相关的元素指令。

 var config = {
    attachTo: angular.element(document.body),
    disableParentScroll: this.disableParentScroll,
    template: '<my-awesome-form-directive></my-awesome-form-directive>',
    hasBackdrop: true,
    panelClass: 'demo-dialog-example',
    position: position,
    trapFocus: true,
    zIndex: 150,
    clickOutsideToClose: true,
    escapeToClose: true,
    focusOnOpen: true
  };