0
두 가지 수준의 용지 입력 값에 액세스하려고합니다. 불행히도 이것은 작동하지 않습니다. 여기 내 최소한의 예이다여러 수준의 양방향 데이터 바인딩
<html>
<head>
<base href="https://polygit.org/polymer+:master/webcomponents+:master/shadycss+webcomponents+:master/components/">
<script src="webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="polymer/polymer.html">
<link rel="import" href="paper-input/paper-input.html">
</head>
<body>
<dom-module id="text-block">
<template>
<style>
#input-test {
width: 100%;
}
</style>
<paper-input id="input-test" label="Test" value="{{blockValue}}"></paper-input>
</template>
<script>
class TextBlock extends Polymer.Element {
static get is() {
return 'text-block';
}
static get properties() {
return {
blockValue: {
type: String,
value: '',
observer: '_onBlockValueChanged'
}
}
}
_onBlockValueChanged() {
console.log('Block value changed');
console.log(this.blockValue);
}
}
customElements.define(TextBlock.is, TextBlock);
</script>
</dom-module>
<dom-module id="my-element">
<template>
<text-block block-value="{{_myValue}}"></text-block>
</template>
<script>
HTMLImports.whenReady(function() {
class MyElement extends Polymer.Element {
static get is() { return 'my-element'; }
static get properties() {
return {
_myValue: {
type: String,
value: '',
observer: '_myValueChanged'
}
};
}
_myValueChanged() {
console.log('_myValue changed');
console.log(this._myValue);
}
}
customElements.define(MyElement.is, MyElement);
});
</script>
</dom-module>
<my-element></my-element>
</body>
</html>I 용지 입력의 내용을 변경할 때, 변경의 _myValue하지 상기 텍스트 블록 요소의 blockValue 전달되지만 주요 요소. block-value={{_myValue}} 으로 바인딩하는 것으로 충분하지 않습니다. 그 밖의 무엇을해야합니까?
내가 가지가 그와 같은 단순한 일 것으로 예상 . 감사! 그것은 잘 작동합니다. – Niels