我试图将一个组件传递到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>