聚合物元素与角度指令答案

【问题标题】：Polymer Elements vs Angular Directives聚合物元素与角度指令
【发布时间】：2014-01-06 19:46:34
【问题描述】：

我知道以前有人问过这个问题，尤其是here。

然而，在我看来，答案很抽象，在实践中我发现自己很困惑。

.vs 的答案似乎是：

Polymer（更准确地说，Shadow DOM）创造了不只组成部分 HTML，但也封装它们。这是一个全新的功能，可以与任何其他功能一起使用模板系统或框架以增强其功能。

这并没有真正告诉我那么多，据我所知，角度指令在实践中的作用几乎相同，尽管聚合物元素在性能方面可能更有效。我敢肯定，在这种情况下，“封装”在这里有某种我不理解的更深层次的含义。

假设我正在开发一个 AngularJS Web 应用程序。我何时、如何以及为什么要在角度指令上使用聚合物元素？

是否会使用聚合物元素而不是角度指令，如果是的话，什么时候会使用一个而不是另一个？或者角度指令会根据聚合物元素来实现吗？

【问题讨论】：

【解决方案1】：

您实际上是在问两个不同的问题，“实现/构建组件与使用一个组件有什么区别？”

消耗组件

在可预见的未来，您将两者结合使用。 Web 组件是用什么技术/库构建的，或者是什么供应商制造的，都无关紧要。只需 bower install（或类似名称）并使用对您的应用有意义的组件。

重要的是一切将都是DOM，这意味着元素将无缝地协同工作。互操作的故事很棒。这是绑定到 Polymer 元素的 Angular 指令的 POC：http://ebidel.github.io/polymer-experiments/polymer-and-angular/together/

目前，建筑元素是另一回事。 Polymer 的方法是以所有事物为中心的 Web 组件。 Angular 是在 Web 组件时代之前构建的，所以情况有些不同。

Angular 指令是一种构建自定义标签/组件的方法。聚合物和自定义元素规范是执行此操作的基于标准的方法。
如何构建 Polymer 元素是非常声明性的。 Angular 指令主要在 JS 中定义（具有引用模板文件的能力）。
因为 Polymer 元素使用自定义元素，所以继承很简单。我不确定 Angular 指令中的继承故事/
Polymer 元素使用 Shadow DOM。这给了他们对 DOM 和 CSS 的封装。您在元素中定义的样式不会溢出，页面样式也不会溢出。我可能是错的，但是 Angular 指令没有任何样式封装的概念。 Shadow DOM 规范免费为我们提供了一个难题。
数据绑定概念类似

角度指令是否会根据聚合物元素实现

最终，Angular 将采用一些不断发展的 Web 组件标准。对于所有框架都是如此。 Ember 刚刚制作了their 2014 plans known，其中包括 Web 组件。例如，Angular.dart 已经将 Shadow DOM 用于指令。
默认情况下，Polymer 元素（自定义元素）可与其他自定义元素互操作。这是因为它们只是 DOM。 DOM 元素可以很好地协同工作:)

希望这会有所帮助！

【讨论】：

所以总而言之，使用 Polymer 自定义元素而不是 Angular 指令来构建组件并使用 Angular 指令只是为了向现有组件添加行为？
链接的示例似乎没有提供真正的比较（Angular 版本有ids 和classes，原因不明。）是否有任何简单的示例说明@987654326 中的代码位置@ 明显短于Angular?
@SvenMalvik 该链接无效。但从我的电子邮件。我不明白如何在不同情况下使用完全不同的组件进行这样的比较。