我的 html 文件中有指令
<add />
<back />
指令在表单上
.directive('add', ['$window', ...
和
.directive('back', ['$window',
这很好用。
如果我将指令更改为驼峰式：
.directive('addPlayer', ['$window', ...
<add_player />
<back />
和
<add:player />
<back />
显示正常而
<add-player /> regular dash
<back />
仅显示<add-player>，之后的所有内容均不显示。
有什么想法吗？
编辑：
我在这里也有同样的行为
【问题讨论】：
为了解决您的问题，我引用 AngularJS 团队的官方声明：（原文如此）
html 规范定义的自闭合或 void 元素对于浏览器解析器来说是非常特殊的。您不能自己制作，因此对于您的自定义元素，您必须坚持使用非 void 元素 (
<foo></foo>)。这不能改变角度。
- 伊戈尔米纳尔
来源：https://github.com/angular/angular.js/issues/1953#issuecomment-13135021
关注AngularJS issue's page 上的其余对话，他们讨论了使用XHTML 提供具有浏览器可接受的自动关闭标签的内容的可能性。但是请注意，AngularJS 并不完全支持它。
【讨论】：
renders 反应到 JavaScript。在Babbel REPL 上查看实际情况
HTML 规范不允许在非空元素上使用自闭合标签。
元素有一个开始标签来指示它们从哪里开始。非空元素有一个结束标记来指示它们的结束位置。
开始标签由以下部分组成，完全按照以下顺序：
- 一个“
- 元素的标签名称。
- （可选）一个或多个属性，每个属性前面必须有一个或多个空格字符。
- （可选）一个或多个空格字符。
- 可选的“/”字符，仅当元素是空元素时才可能出现。
- 一个“>”字符。
在 HTML5 规范中有有限数量的void elements。以下是完整列表：
area, base, br, col, command, embed, hr, img, input, @98765338@, @987 、param、source、track、wbr。
浏览器的解析器必须监听规范。由于在非空元素标签中使用斜线是无效的，因此解析器会忽略结尾的/>，而<back /> 表示<back>。因此，您永远不会关闭阻止其他元素工作的第一个元素。
在Plunker 你有：
<body>
<back></back>
Self closing <back />
Self closing <back />
</body>
解析成
<body>
<back></back>
Self closing <back>
Self closing <back>
</back>
</back>
</body>
然后，您在指令中指定 template: '<button>back</button>'，该指令将 back（及其子项）替换为指定的 HTML，结果：
<body>
<back>
<button>back</button>
</back>
Self closing <back>
<button>back</button>
</back>
</body>
全部使用<back></back>，它会正常工作。或者，您可以使用元素属性：<div back="attr"></div>。
有关详细信息，请参阅以下讨论：
【讨论】：
我最近遇到了同样的问题，并设法通过不使用自闭合标签来解决它。试试<add-player></add-player>，而不是自动关闭的版本。
我不知道为什么自闭标签不能与指令标签名称中的破折号一起使用。当天进行了快速研究，并没有在 HTML/XHTML 方面找到任何东西。也许是 Angular 中的错误/限制？
【讨论】：