在聚合物入门页面，我们看到了一个聚合物的例子:
<html>
<head>
<!-- 1. Shim missing platform features -->
<script src="polymer-all/platform/platform.js"></script>
<!-- 2. Load a component -->
<link rel="import" href="x-foo.html">
</head>
<body>
<!-- 3. Declare the component by its tag. -->
<x-foo></x-foo>
</body>
</html>
你会注意到<x-foo></x-foo>是由platform.js和x-foo.html定义的。
看起来这相当于AngularJS中的指令模块:
angular.module('xfoo', [])
.controller('X-Foo', ['$scope',function($scope) {
$scope.text = 'hey hey!';
})
.directive('x-foo', function() {
return {
restrict: 'EA',
replace: true,
controller: 'X-Foo',
templateUrl: '/views/x-foo.html',
link: function(scope, controller) {
}
};
});
这两者之间有什么区别?
有哪些问题是聚合物解决了，而AngularJS还没有或不会解决的?
将来有计划把Polymer和AngularJS绑定在一起吗?
I think from a practical perspective, in the end the template feature of angular directives, and the web component methodology leveraged by polymer both accomplish the same task. The major differences as I can see it are that polymer leverages web APIs to include bits of HTML, a more syntactically correct, and simplistic way of achieving what Angular does programatically as it renders templates. Polymer is however as has been stated, a small framework for building declarative and interactive templates using components. It is made available for UI design purposes only, and is only supported in the most modern browsers. AngularJS is a complete MVC framework designed to make web applications declarative by use of data bindings, dependencies, and directives. They're two completely different animals. To your question, it seems to me at this point you'll get no major benefit from using polymer over angular, except having dozens of pre built components, however that would still require you to port those over to angular directives. In the future however, as the web APIs become more advanced, web components will completely remove the need to programatically define and build templates as the browser will be able to simply include them in a similar way to how it handles javascript or css files.
聚合物是一种Web Components垫片
"Web Components" is a new set of standards that is enveloped by HTML 5 designed to provide reusable building blocks for web applications.
Browsers are at various states of implementing the "Web Components" specification, and therefore it's too early to write HTML using Web Components.
But alas! Polymer to the rescue! Polymer is a library that provides an abstraction layer to your HTML code, allowing it to make use of the Web Components API as if it were fully implemented in all browsers. This is called poly-filling, and the Polymer team distributes this library as webcomponents.js. This used to be called platform.js btw.
但是Polymer不仅仅是一个web组件的填充库…
Polymer还通过Elements提供开放和可重用的Web组件构建块
所有元素都可以定制和扩展。它们被用作从社交小部件到动画到web API客户端的任何东西的构建块。
Polymer不是一个web应用程序框架
Polymer is more of a library than a framework.
Polymer does not have support for things like routes, application scope, controllers, etc.
But it does have two-way binding, and using components "feels" just like using Angular directives.
Although there are some overlaps between Polymer and AngularJS, they are not the same. In fact, the AngularJS team has mentioned utilizing Polymer libraries in upcoming releases.
Also note that Polymer is still considered "bleeding edge" while AngularJS is stabilizing.
It will be interesting to watch both of these Google projects evolve!
I think from a practical perspective, in the end the template feature of angular directives, and the web component methodology leveraged by polymer both accomplish the same task. The major differences as I can see it are that polymer leverages web APIs to include bits of HTML, a more syntactically correct, and simplistic way of achieving what Angular does programatically as it renders templates. Polymer is however as has been stated, a small framework for building declarative and interactive templates using components. It is made available for UI design purposes only, and is only supported in the most modern browsers. AngularJS is a complete MVC framework designed to make web applications declarative by use of data bindings, dependencies, and directives. They're two completely different animals. To your question, it seems to me at this point you'll get no major benefit from using polymer over angular, except having dozens of pre built components, however that would still require you to port those over to angular directives. In the future however, as the web APIs become more advanced, web components will completely remove the need to programatically define and build templates as the browser will be able to simply include them in a similar way to how it handles javascript or css files.
1 & 2) Polymer components are scoped because of their hidden tree in the shadow dom. That means that their style and behaviour cannot bleed out. Angular is not scoped to that particular directive you create like a polymer web component. An angular directive could possibly conflict with something in your global scope. IMO the benefit you will get from polymer is what I explained.. modular components that have scoped css & JavaScript to that particular component that nothing can touch. Untouchable DOM!
Angular directives can be created so that you can annotate an element with several pieces of functionality. In Polymer web components that is not the case. If you want to combine functionality of components you include two components into another component (or wrap them in another component) or you can extend an existing component. Remember the main difference still is that each component is scoped in polymer web components. You can share css & js files across several components or you can inline them.
3)是的，根据Rob Dodson和Eric Bidelman的说法，Angular计划在版本2+中加入聚合物
有趣的是，这里没有人提到scope这个词。我认为这是主要的区别之一。
它们有很多不同之处，但当涉及到为应用程序创建像积木一样的功能块时，它们也有很多相似之处。我认为可以肯定地说，Angular将是应用程序框架，而聚合物有一天可能会与指令一起出现在同一个应用程序中，主要的区别是作用域，但聚合物可能会取代你当前的许多指令。但我看不出为什么Angular不能按原样工作，同时也要包含聚合物组件。
在我写这篇文章的时候，我又读了一遍答案，我注意到埃里克·比德尔曼(Eric Bidelman)在他的回答中提到了这一点:
Shadow DOM允许组合HTML片段，同时也是封装HTML的工具。”
我的答案来自于对Rob Dodson和Eric Bidelman的多次采访。但我觉得这个答案的措辞并没有让这个人的问题得到他想要的理解。话虽如此，我认为我已经触及了他正在寻找的答案，但在这个问题上，我所掌握的信息绝不比Rob Dodson和Eric Bidelman更多
以下是我收集到的信息的主要来源。
JavaScript Jabber -聚合物与Rob Dodson和Eric Bidelman
商店谈话节目-网络组件与罗伯多德森
