У меня есть полимер v-fire:
<script>
Polymer({
is: 'v-fire',
properties : {
onFire: {
type : String,
reflectToAttribute: true
}
},
firing: function () {
this.fire('fire');
}
})
</script>
Я хочу иметь возможность использовать его в любом месте моих полимерных элементов, чтобы они запускали внутреннюю функцию, чтобы заставить их выполнять определенную задачу, например обновление, чтобы они все обновлялись, когда v-fire
вызывает firing
.
Например, я создаю новый объект для тестирования:
<script>
Polymer({
is: 'fire-tester',
_updateContent: function () {
alert('I get updated');
}
});
</script>
в index.html
…
<link rel="import" href="/components/fire-tester/fire-tester.html">
…
<body>
<fire-tester id="fire-tester"></fire-tester>
<script>
(function () {
var ft = document.getElementById('fire-tester');
// make a global v-fire Polymer
var vfire = document.createElement('v-fire');
// custom callback of the Polymer's that will include the v-fire
vfire.onFire = '_updateContent';
/**
* And here, I try to insert the v-fire in the fire-tester Polymer
*/
Polymer.dom(ft.root).insertBefore(
vfire,
Polymer.dom(ft.root).childNodes[0]
);
// the dom is pretty neat, fire-tester contains v-fire with the custom on-fire callback
// then I try to fire the event
vfire.firing(); // but nothing happen
});
</script>
Это не работает, потому что я считаю, что v-fire не обрабатывается при вставке в fire-tester. Есть ли способ заставить Polymer обрабатывать фрагмент dom, как если бы он был объявлен в локальной модели DOM?