AngularJS 1.5：用html標簽替換組件標簽

Question

我有一個Angular 1.5應用程序，可以廣泛使用組件。 我的問題是自定義組件標簽的可訪問性測試失敗。 我的視圖模型模板如下所示：

<my-component data='myModel'></my-component>

<script type="text/ng-template" id=myComponent.html">
    <pre> {{ data | json }} </pre>
</script>

這將導致它在實時DOM中呈現：

<my-component data='myModel'>
    <pre>
        ...
    </pre>
</my-component>

我的測試工具無法識別my-component標簽，並且無法訪問。

我已經研究過將my-component標記轉換為div，但無法弄清楚該怎么做。 1.5中的指令具有替換功能。 2.0中的組件具有選擇器屬性。 我也不相信我可以使用包含來實現這一點（因為my-component的控制器將需要引用其父標記）。

我在考慮正確的方法嗎？ 也許我應該為屏幕閱讀器使用ng-Aria來忽略這些標簽？ 有沒有人遇到這個問題？

Answer 1

您不應該更改元素的標簽，但是應該在可能的情況下本機添加aria標簽，或者通過角度aria添加。 閱讀Angular輔助功能指南 。