无法绑定到“已禁用”，因为它不是“：svg：button”的已知属性

Question

我正在使用ngx-charts并尝试向图中的节点添加按钮。下面的代码：

HTML：

<ngx-graph>

<ng-template #defsTemplate>
  <svg:marker id="arrow" viewBox="0 -5 10 10" refX="8" refY="0" markerWidth="4" markerHeight="4" orient="auto">
    <svg:path d="M0,-5L10,0L0,5" class="arrow-head" />
  </svg:marker>
</ng-template>

<ng-template #nodeTemplate let-node>
  <svg:g class="node" xmlns="http://www.w3.org/2000/xhtml" width="150" height="100">
    <svg:foreignObject width="150" height="120">
      <xhtml:div class="cardContainer" xmlns="http://www.w3.org/1999/xhtml">
        <img [attr.src]="node.data.background" width="100%" height=50%></img>
        <label class="name">{{node.label}}</label>
      </xhtml:div>
      <button mat-button onclick="alert('test!');">test</button>
    </svg:foreignObject>
  </svg:g>
</ng-template>

<ng-template #linkTemplate let-link>
  <svg:g class="edge">
    <!--Path template-->
  </svg:g>
</ng-template>
</ngx-graph>

如果我在按钮上使用Material Design的mat-button属性，则会收到错误消息： 无法绑定到“已禁用”，因为它不是“：svg：button”的已知属性

如果我不使用该属性，则该按钮会出现并且工作正常。材料设计对象确实起作用，因为主要组件具有一个垫工具栏。

谢谢！