Accessing an attribute on a child that's set with a data binding

81 views
Skip to first unread message

Rob Dodson

unread,
Apr 4, 2014, 2:21:29 AM4/4/14
to polym...@googlegroups.com
I have a little bit of markup that looks like this:

<polymer-element name="blog-post" noscript>
      <template>
        
        <mark-down>
          <textarea value="{{post}}"></textarea>
        </mark-down>

        <polymer-localstorage name="my-blog-editor" value="{{post}}">
        </polymer-localstorage>
      </template>
</polymer-element>

I'd like the mark-down tag to be able to see the value of the textarea but I'm having a hard time knowing when to query for it.

Inside of mark-down my code looks something like this:

      attached: function() {
          this.textarea = this.$.textareaContent.getDistributedNodes()[0];  // this grabs the textarea element

          // create an observer instance
          var observer = new MutationObserver(function(mutations) {
            mutations.forEach(function(mutation) {
              console.log(mutation);
            });
          });
           
          // pass in the target node, as well as the observer options
          observer.observe(this.textarea, { attributes: true });
      }

Unfortunately the mutation observer never fires. I've tried checking for the value of textarea directly in attached and domReady but it's always null. The only success I've had is to use a setTimeout to check for the value asynchronously.

Rob Dodson

unread,
Apr 4, 2014, 2:24:14 AM4/4/14
to polym...@googlegroups.com

Rafael Weinstein

unread,
Apr 4, 2014, 8:05:33 AM4/4/14
to Rob Dodson, polymer-dev
i think you probably want to observe the characterData of the text-area, not the attribute.


Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/6d343f4a-b8fd-43df-8c18-d62072bcbc34%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

Rob Dodson

unread,
Apr 4, 2014, 10:10:29 AM4/4/14
to Rafael Weinstein, polymer-dev
Hm, still no luck observing characterData. Here's a jsbin: http://jsbin.com/jidiyexi/2/edit

Rafael Weinstein

unread,
Apr 4, 2014, 11:01:16 AM4/4/14
to Rob Dodson, polymer-dev
Ah, sorry. I'm not sure what I was thinking. TextArea is like input, the DOM storage values don't change when the input value changes. IOW, you can observe it's value with MutationObserver.

You need to listen to the value of the textarea.value changing. You can do that either by listening to the 'value' event or by observing the value of this.post in the blog post element.

Scott Miles

unread,
Apr 4, 2014, 12:57:37 PM4/4/14
to Rafael Weinstein, Rob Dodson, polymer-dev
Fwiw, please don't fork conversations (now there some here, and some in SO).


Reply all
Reply to author
Forward
0 new messages