javascript - 页面上的每个 "component"是否应该是 angularJS 中的指令

Question

在创建 angularJS 应用程序时，最好的做法是将几乎所有“组件”创建到指令中吗？当我说组件时，我指的是执行功能的任何 HTML 元素分组。示例:

登录:

 - <input type="text" name="username" />
 - <input type="password" name="password" />
 - <button>Login</button>

事件:

 - <h3>Title</h3>
 - <input type="date" name="eventStart" />
 - <p>This is an event description</p>

博客文章:

 - <h3>Title</h3>
 - <small>Blog meta - Blog Author</small>
 - <p>This is a post blah blah blah</p>

Answer 1

指令允许您重用代码。我当然会把所有被重用的东西都放到一个指令中。为避免重复自己，您应该使用指令。我什至会说即使你不重复自己，即代码只在一个地方，你也应该把它变成一个指令。

仅在一个地方使用的指令不会减少代码，但它确实分离了关注点。我认为指令类似于类。类作用域强制类成为独立的 block ，而不是大量的代码。同样，创建具有自己范围的指令会使它们成为独立的 block ，以有限的方式与周围环境进行交互。

ngInclude 有点不同。我认为它等同于 eval 或 C 的#include。你确实得到了一点分离，但所有东西都共享相同的范围，并且很容易让零件交织在一起，但除非经过检查，否则看起来不像它们。

至于 YAGNI，我认为这是一个不同的问题。 YAGNI 正在谈论添加功能。我谈论的更多是代码结构，而不是添加任何额外的东西。我看到相同的代码，但组织方式略有不同。当然，编写指令需要一些工作，但与类一样，它们也可以是轻量级的并且很容易创建(就所需的思考量而言)。