代码之家  ›  专栏  ›  技术社区  ›  Jordan England-Nelson

将组件传递到Angularjs对话框模板时删除额外的md对话框包装器

  •  0
  • Jordan England-Nelson  · 技术社区  · 8 年前

    我试图将一个组件传递到Angularjs对话框中,而不用$mdDialog将我的组件的html包装在一个额外的标记中。

    这是我的父控制器代码:

    vm.showSampleReport = function (questionType) {
                $timeout(function(){
                  $mdDialog.show({
                    parent: angular.element(document.body),
                    template: '<sample-report report-type="questionType"></sample-report>',
                    clickOutsideToClose: true,
                    locals: {
                      reportType: questionType
                    }
                  })
    

    我之所以需要它,是因为我希望对话框占据页面的全部高度。在组件的html中,我将内联样式添加到包装器中,但当整个组件包装在一个额外的html中时,这就被重写了,默认情况下,该html设置为最大高度:80%;

    以下是我的组件的html:

    <md-dialog style="border-radius: 0px;height: 100vh;max-height: 100%;" class="print">
      <md-dialog-content layout="column" class="container question-dialog-container">
        <div class="vm.reportType"></div>
      </md-dialog-content>
    </md-dialog>
    
    1 回复  |  直到 8 年前
        1
  •  1
  •   Maak    8 年前

    您可以使用 autowrap 选项 $mdDialog.show .

    自动换行-{布尔=}:是否使用 <md-dialog> 如果未提供标签,则标记。默认为true。如果提供自定义对话框指令,则可以禁用。

    https://material.angularjs.org/latest/api/service/$mdDialog#mddialog-show-optionsorpreset