观察Polymer JS中对象的更改

我有一个模型对象的元素,我想这样观察:
<polymer-element name="note-editor" attributes="noteTitle noteText noteSlug">
  <template>
    <input type="text" value="{{ model.title }}">
    <textarea value="{{ model.text }}"></textarea>
    <note-ajax-button url="/api/notes/" method="POST" model="{{model}}">Create</note-ajax-button>
  </template>

  <script>
    polymer('note-editor',{
      attached: function() {
        this.model = {
          title: this.noteTitle,text: this.noteText,slug: this.noteSlug
        }
      },});
  </script>
</polymer-element>

我想观察模型中的变化,但显然不可能在元素中使用modelChanged回调,也不能在note-ajax-button元素中使用.怎么了?我怎样才能做到这一点?

我已经尝试过单独观察这些字段,但它根本不干净.您在那里看到的按钮元素的状态应该根据模型状态而改变,因此我需要观察对象的更改,而不是属性.
谢谢!

解决方法

要观察对象中的路径,需要使用observe块:
polymer('x-element',{
  observe: {
    'model.title': 'modelUpdated','model.text': 'modelUpdated','model.slug': 'modelUpdated'
  },ready: function() {
    this.model = {
      title: this.noteTitle,slug: this.noteSlug
    };
  },modelUpdated: function(oldValue,newValue) {
    var value = Path.get('model.title').getValueFrom(this);
    // newValue == value == this.model.title
  }
});

http://www.polymer-project.org/docs/polymer/polymer.html#observeblock

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...