注入 Vue 时 HTML 标签不关闭

Question

我的意图是将 Vue 注入到 md-menu 标签（@material/web）中，如文档所示：

<div style="position:relative;">
  <button
      class="anchor"
      ${ref(anchorRef)}
      @click=${() => this.menuRef.value.show()}>
    Click to open menu
  </button>
  <!--
    `has-overflow` is required when using a submenu which overflows the
    menu's contents
  -->
  <md-menu has-overflow ${ref(menuRef)} ${(el) => el.anchor = anchorRef.value}> <md-menu-item header="This is a header"></md-menu-item>
    <md-sub-menu-item header="this is a submenu item">
      <md-menu slot="submenu">
        <md-menu-item
          header="This is an item inside a submenu"></md-menu-item>
      </md-menu>
    </md-sub-menu>
  </md-menu>
</div>

然而 md-menu 标签没有关闭。我该怎么做才能使 HTML 正确呈现。

库链接：Github

我试过用

${(el) => el.anchor = anchorRef.value}

替换

function (el) {el.anchor = anchorRef.value}

，但菜单仍然没有出现。