Question

我正在使用Polymer Designer中的代码镜像组件，可以设置初始值，但无法看到如何从用户那里获取代码更改。

我使用

初始化代码镜像

<code-mirror id="code_mirror" value="{{code}}">


</code-mirror>

并希望收听{{code}}中的更改，但codeChanged似乎无法触发。

我知道我可以使用code_mirror。$。mirror.getValue（）来获取实际值，但是想使用数据绑定。

我尝试过使用改变无济于事。

Answer 1

假设您正在使用https://github.com/PolymerLabs/code-mirror，您需要做的是使CodeMirror中创建的ready实例处理实例本身正在发出的一些事件，然后生成{{ 1}}元素fire any custom event（我知道的东西叫做事件中继）

以下示例使编辑器值更改时，聚合物元素触发自定义事件code-mirror

code-change

然后聚合物自定义元素的任何实例都需要使用Polymer的声明性事件映射或通过ready: function() { var me = this; //... this.mirror = CodeMirror(this.shadowRoot, { /* ... */ }); this.mirror.on('change', function () { // me = polymer instance me.fire('code-change', { value: me.mirror.getValue() }) }); }

来侦听该事件

第一种情况（如果addEventListener在另一个code-mirror内）：

<polymer-element />

第二种情况（）：

<code-mirror on-code-change="{{ onCodeChange }}"></code-mirror>
// ...
<script>
Polymer({
  onCodeChange: function(event, detail, sender) { ... }
});
</script>

获取代码镜像元素的值

1 个答案: