我应该在角指令中使用单个对象或单个值作为属性

这是一个'最佳实践'问题，但我仍然认为可能有正确的答案。

我有一个具有六个可配置选项的指令。我应该在指令上设置六个不同的属性（如下）：

<my-directive
  my-width="300"
  my-height="300"
  my-status="true"
  my-foo="yes"
  my-bar="no">
</my-directive>

或，我应该将配置对象传递到单个属性中（如下）：

<my-directive my-options="options"></my-directive>

这只是偏好还是通常首选的方法？任何反馈都将不胜感激。谢谢：）

这是主要是偏爱问题。由于您可以通过两种路线实现最终结果。我个人更喜欢看到您的第一个示例中建议的单个属性，以使用冗长的，表达的元素。

仅在您的第一个示例中查看<my-directive my-width="300" my-height....>，我就可以猜测该指令的用途，并且可以轻松地将发生的事情拼凑在一起。只是看到my-options="options"，除非我挖出一些代码来了解此元素的意图，否则我不知道。

作为一个项目的单个开发人员，这可能是一个低优先级的考虑 - 通常被称为"嗯，有什么区别？"，但是当您介绍其他在同一代码基础上工作的其他成员，具有冗长的态度可以减轻努力理解您的意图的努力，特别是对于不熟悉Angularjs的开发人员。

就技术利益而言，例如，您只想将样式规则应用于属性包括my-foo的元素。与CSS选择器一起使用以下

变得微不足道

[my-foo="yes"] {
    background-color: dodgerblue;
}
[my-foo="no"] {
    background-color: tomato;
}

另一个快速示例 - 说您的项目中有jQuery，并希望做

之类的事情

$("[my-bar='no']") // do whatever

执行这些任务的另一路线有可能变得棘手。考虑一下这个现实词的例子：UX设计师想利用这些操纵，但要说的是，对AngularJS并不是很精明 - 这些任务变得不必要地痛苦。

当您开始考虑这样的方面和示例时，在元素上具有粒度控制变得非常宝贵。为了您最初提出这个问题的兴趣，每个人都可以理解将其整合到my-options="options"等简洁之类的东西的愿望 - 但是努力争取较短的代码并不总是有利的。

都考虑到，两者的组合可能是理想的，具体取决于您正在使用的属性的感知的重要性。height，width，status？ - 可能很重要且描述足以独立。一个复杂的统计对象，具有指令处理中使用的许多字段？ - 可能有资格保留对象。

相关内容