Im index.html Ich verwende:Polymer 1.4 dom-bind definieren properrties
<template is="dom-bind" id="app">
In einem normalen dom-Modul I verwendet werden:
<script>
(function() {
'use strict';
Polymer({
is: 'my-xxxx',
properties: {
/* location for properties */
}
Wo definiere ich die in den verwendeten Eigenschaften Vorlage dom-bind (z. B. um einen Beobachter an sie anzuhängen?
Basierend auf Polymer docs, verwenden Sie JavaScript (inline oder importiert in index.html), um Vorlageneigenschaften insid hinzuzufügen e eines Ereignishandlers für das Ereignis dom-change der Vorlage. Zum Beispiel könnten Sie eine message Eigenschaft auf die Vorlage mit diesem Skript hinzufügen:
var t = document.getElementById('app');
t.addEventListener('dom-change', function() {
t.message = 'Hello world!';
});
Siehe Demo unter:
<head>
<base href="https://polygit.org/polymer+:master/components/">
<script src="webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="polymer/polymer.html">
</head>
<body>
<template is="dom-bind" id="app">
{{message}}
</template>
<script>
var t = document.getElementById('app');
// The dom-change event signifies when the template has stamped its DOM.
t.addEventListener('dom-change', function() {
// auto-binding template is ready.
t.message = 'Hello world!';
});
</script>
</body>
Dies funktioniert für das Hinzufügen ein Anfangswert für eine Eigenschaft. Aber wie definiere ich andere Elemente, die normalerweise in Polymereigenschaften deklariert sind, wie type (Anzahl, String etc) Annotationen wie readOnly und die meisten wenn alle Observer –
Es gibt keine Polymer API zum Beobachten von Eigenschaften (oder Erstellen von Eigenschaftsobjekten) von einer automatisch bindenden Vorlage . Warum würden Sie nicht einfach ein Polymer-Element verwenden? – tony19
das ist, was ich tun würde, aber die Polymer-Starter-Kit (PSK) -Anwendung tut das nicht und wir müssen lernen, dass unser Schüler nach dem, was empfohlen wird (was in der PSK ist) zu arbeiten. –