There will be some complications with this setting.
Firstly, Angular does not know how to bind to custom elements, so binding from Angular to a polymer component, for example:
<my-element foo="{{ bar }}">
will set the foo attribute of the element, which can only be a string, but will not use Node.bind to bind to the foo property. This is a big problem for snapping complex objects or for two-way snapping.
I created a directive that allows you to use Node.bind from Angular, but for Dart. You can transfer it to JS: https://github.com/google/angular_node_bind.dart
It works by capturing expressions in double square brackets and customizing the clock expression and binding through Node.bind. The previous example would change to:
<my-element foo="[[ bar ]]">
Binding is two-way. If <my-element> changes the value of foo, the value of bar will be updated.
The second problem is dependency injection. Since the browser is responsible for creating the custom element, Angular does not know when it is created, and it does not have the ability to inject dependencies. So you need a way for the Polymer element to hold the Angular service (or any service object actually, Angular or not).
Once you use something like angular - node-bind, you can use bindings to pass the service to the element. Maybe like this:
<my-element http-service="[[ $http ]]">
(Since I'm not an Angular expert, I was just trying to get Angular and Polymer to play together, I'm not 100% sure that $ http is just available in expressions).
The Angular team said it intends to support custom elements in Angular 2.0, although their recent blog post does not mention this.