Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[0.9] Data binding? #1517

Closed
drarmstr opened this issue May 12, 2015 · 3 comments
Closed

[0.9] Data binding? #1517

drarmstr opened this issue May 12, 2015 · 3 comments

Comments

@drarmstr
Copy link

I'm trying to move from 0.5 to 0.9 and am having issues with data binding. It appears rather broken so I'm afraid there is some user error, but here is what I see:

Where the component template definition is:

<dom-module id="my-component">
    <template>
        <a href="{{string_prop}}">{{string_prop}}</a>  // BLANK
        <a href="{{obj_prop.path}}">{{obj_prop.path}}</a>  // WORKS!
        <a href="{{getter_prop}}">{{getter_prop}}</a>  // BLANK
        <a href="{{computed_prop()}}">{{computed_prop()}}</a>  // BLANK
    </template>
</dom-module>

Where the component logic contains:

properties = {
    string_prop: String,
    obj_prop: Object,
}
get getter_prop() { return "GETTER PROP"; }
computed_prop() { return "COMPUTED PROP"; }

The component is then created in a in another component. What is wrong with the use or the data binding that most of the items are blank?

UPDATE: Well, I made some edits trying to create a simple reproducer and I can't get it all to fully reproduce in the simple case. So, the issue may be related to a more complex interaction or composition. I'll update if I can narrow it down better. Otherwise, I guess close this for now?

@arthurevans
Copy link

Computed properties need to have at least one dependent property.

https://www.polymer-project.org/0.8/docs/devguide/properties.html#computed-properties

By definition, computed properties are computed when their inputs change, so if they have no inputs they'd never be called. I'll update the doc to make this clearer.

Properties with ES5 getters & setters are not supported, because 0.8/0.9 generates custom accessors to enable data binding.

You're not setting a default value for string_prop in this example, so I would expect it to be blank (but I assume that's not exactly your code above).

@drarmstr
Copy link
Author

Right, string_prop was being set as an attribute when the element was created. Ignore the improper underscore convention for attribute/property mapping, this was just pseudo-code.

I was trying to create a simplified reproducer on jsfiddle, but couldn't reproduce the "string_prop" issue there; so it's likely a more complex composition issue. I guess please close this issue for now..

Is there a proper way to include Polymer 0.9 on jsfiddle?

Noted about getters/setters not supported; would probably be useful if that were added to the docs as it seemed like a syntactically clean way to provide a computed property.

@arthurevans
Copy link

Thanks for that. I've added a note about getters/setters to the migration guide for 0.9.

I have been using rawgit to include polymer in jsbin/jsfiddle/plunker:

<link rel="import" href="https://rawgit.com/Polymer/polymer/0.8-preview/polymer.html">

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants