我所在的团队有大约 6 名 UI 开发人员，他们的质量参差不齐，几乎没有 Angular 经验。许多人是承包商，对代码库几乎没有经验。该应用程序有一个非常花哨（复杂）的用户界面。它支持 IE8+（希望很快 IE9+）。
我们将 Angular 引入应用程序的主要扩展，我被要求为团队编写 Angular 使用指南。
我们将使用指令来创建精美的 UI 元素，所有元素都以“ipwr”为前缀以避免名称冲突。我正在尝试决定是否要求开发人员为他们的指令提供限制“元素”或“属性”。只要求一个，以避免混乱和混乱。
我的问题是：对于指令、“元素”或“属性”，哪种限制更好或更流行？ 我主要关心的是对于没有 Angular 经验且对应用程序代码库不熟悉的人来说易于使用，以减少错误、复制和粘贴行为等。
【问题讨论】：
标签： angularjs angularjs-directive maintainability
角度指导说，只要指令可以完全控制它的模板，这意味着它有一个正在渲染的模板等，你应该使用“元素”限制。
对于属性，他们建议仅在您向现有元素添加“行为”或装饰现有元素时使用这些属性。
例如，考虑一下 ng-click 指令，它被用作属性而不是元素，因为 click 指令只是将点击行为添加到某个元素。
另一个例子是 ng-repeat 指令，它也用作属性而不是元素，因为它将重复使用它的元素。
现在，此指南来自 Angular 文档；但是，我不一定知道元素与属性会为您提供“更好”的方法，它更像是一种约定。
现在，如果您必须支持较旧的浏览器，那么您可能需要考虑使用注释或类指令。
我个人的偏好是只使用属性限制；主要是因为刚接触 Angular 的人一开始看到限制时会不知所措，这是可以使用的选项的变体。
【讨论】：
在做出这些类型的决定时，我通常会遵从John Papa AngularJS style guide。他说：
当它独立时倾向于作为一个元素来实现 增强其现有 DOM 元素时的属性。
【讨论】：
如果你想保持你的 HTML 有效，你会使用属性，例如如果你有一个指令 ipwr-modal，你可以将它声明为<div data-ipwr-modal="you-could-put-some-binding-here"></div>。
但是，当使用自定义布局创建指令时，您最好使用元素声明（如果您不需要使 HTML 有效）。这是更明显的表达方式：“嘿，我们这里有一个自定义组件”。
【讨论】：
需要考虑的几点：
大多数时候属性是最好/最方便的选项（这不是偶然的默认值）。
你可以用元素绑定指令做任何事情，你也可以用属性绑定做。
元素绑定指令有时更具描述性/可读性。
如果您希望您的代码通过某些类型的验证，您应该使用属性。
由于您要支持 IE8，请记住自定义标签有额外的开销 (more info)，这会损害可维护性。
顺便说一句，您不能仅将指令限制为元素（而不影响功能），因此更多的是允许“元素”与否的问题。请注意，一个元素通常具有多个指令，并且放置在同一元素上的指令可以协作并增强彼此的行为。因此，将指令的使用限制为“元素”，意味着将每个元素的自定义指令数量限制为 1，这会严重降低功能潜力。
也就是说，这就是我（'d）做的：
如果 IE8 不是问题，请同时允许（主要使用属性）。
如果 IE8（或自定义标签的开销）是个问题，请仅使用属性。
一般来说，如果只允许一种形式，它应该是属性（可在任何地方使用，无需额外开销，提供所有功能）。
【讨论】：