Question

我刚开始尝试使用聚合物，并尝试在一个单页应用中与 AngularJS 一起使用。因此，我选了两个polymer-ui-components：polymer-ui-sidebar-menu和polymer-ui-pages。每次用户从侧边栏中选择一个项目时，页面组件应该显示其项目具有相同的索引...

但是如何连接这两个组件？

我尝试使用菜单中的onclick事件，但这不能按预期工作。

除了他们自己的文档之外，万维网上可能还有关于聚合物的有用文档吗？

更新

HTML：

<polymer-ui-sidebar-menu label=Channels>
  <polymer-ui-menu-item ng-repeat="channel in channels"
    ng-click=select($index)
    label="{{ channel }}"
    icon=menu>
  </polymer-ui-menu-item>
</polymer-ui-sidebar-menu>
<polymer-ui-pages>
  <span ng-repeat="channel in channels">content: {{ channel }}</span>
</polymer-ui-pages>

控制器：

$scope.select = function (index) {
  angular.element("polymer-ui-sidebar-menu")[0].selected = idx;
  angular.element("polymer-ui-pages")[0].selected = idx;
};

要让angular.element(selector)中的选择器正常工作，您必须在jquery之前加angular polymer之前加jquery！

Answer 1

我制作了一个视频，演示了Web组件（Polymer元素）如何与Angular指令对话：http://www.youtube.com/watch?v=p1NpZ-0Op0w&list=PLRAVCSU_HVYu-zlRaqArF8Ytwz1jlMOIM&index=1

视频数据中的示例 - 使用Angular的数据绑定功能绑定组件的属性，但您应该能够使用其他功能来使事情正常工作。您是否尝试在ng-click上添加<polymer-ui-sidebar-menu>？

连接聚合物组件和角度控制器

1 个答案: