У меня есть набор пользовательских полимерных элементов, которые я хотел бы использовать в угловом приложении.

Кажется, что есть проблема, связанная с тегом содержимого полимерного элемента. Содержимое элемента отображается в неправильном месте внутри полимерного элемента, если элемент расположен внутри углового компонента.

Пример:

Шаблон моего полимерного элемента "my-button" выглядит так:

<template>

  <button>
    <content></content>
  </button>

</template>

Используйте снаружи угловой

Когда я использую этот элемент за пределами моего углового компонента 2, я получаю ожидаемый результат:

Использование:

<my-button>Foo</my-button>

Результат:

<my-button>
  <button>
    Foo
  </button>
<my-button>

Использовать в угловых 2 компонентах

При использовании внутри углового компонента 2 содержимое всегда отображается в конце шаблона элементов. Так же, как тег содержимого не существует.

Использование:

<my-button>Foo</my-button>

Результат:

<my-button>
  <button>

  </button>
  "Foo"
<my-button>

Вопрос

Проблема может заключаться в том, что полимер и угловой 2 оба используют тег содержимого для трансклюции. Так что, возможно, все становится немного грязно при использовании обоих вместе.

Я хотел бы использовать все мои полимерные элементы внутри углового 2. Поэтому любые идеи о том, как это исправить, будут очень благодарны.