角度材质 - 预渲染对话框不会出现，但背景颜色会发生变化

Question

我试图使用角度材质创建预渲染模态。当我单击应该触发模态的按钮时，屏幕变为深灰色（模态背景），就像模态存在但实际模态不会出现一样。我基本上直接从Angular Material的演示中复制了它，所以我不确定它为什么不起作用。

HTML

    color     cost    temp  original_idx
0   blue      11.5    80.4            0
1   blue      12.0    80.4            0 
2   blue      12.5    80.4            0  
3    red       7.6    81.2            1 
4    red       8.1    81.2            1 
5    red       8.6    81.2            1 
6   pink      24.0    83.5            2
7   pink      24.5    83.5            2
8   pink      25.0    83.5            2

CSS

<md-button class="md-raised md-primary"ng-click="vm.showModal($event)">
     Add Review
</md-button>
<md-dialog layout-padding aria-label="myDialog" id="myDialog" class="dialog">
    <md-dialog-content>
        <h2>Pre-Rendered Dialog</h2>
        <p>
            This is a pre-rendered dialog, which means that <code>$mdDialog</code> doesn't compile its
            template on each opening.
            <br/><br/>
            The Dialog Element is a static element in the DOM, which is just visually hidden.<br/>
            Once the dialog opens, we just fetch the element from the DOM into our dialog and upon close
            we restore the element back into its old DOM position.
        </p>
    </md-dialog-content>
</md-dialog>

控制器

.dialog {
    visibility: hidden;
}