如何将指令中的$ mdSidenav附加到页面的body元素？

Question

我有一个问题，我创建了一个指令，我想从中打开一个sidenav。我面临的问题是sidenav打开但已附加到元素，因此仅显示在元素内部。

html结构如下：

<md-button class="md-button">
    <sidenav flex layout="row">Klick here</sidenav>
  </md-button>

如何获取将$ mdNav附加到body标签或我选择附加的任何父元素上？

这是一支钢笔来演示： Codepen