CODEWITHSUNDEEP
javascriptpolymerpolymer-1.0
dman
dman

Reputation: 11064

Polymer- use behavior to share object between elements?

Is it possible to use behaviors to share a object between elements? 

<script>
  selectedBehavior = {
    properties: {
      selected: Object
    }
  }
</script>

<dom-module id="paper-menu-custom">
  <style>
  </style>
  <template>
    <paper-menu attr-for-selected="name" selected="{{selected.choice}}">
    ...
  <script>
    Polymer({
        is: "paper-menu-custom",
        behaviors: [selectedBehavior]
    });

  toolbars = document.querySelector('paper-menu-custom');
  toolbars.selected.choice = "home";

Uncaught TypeError: Cannot set property 'choice' of undefined

Upvotes: 2

Views: 1054

Answers (4)

Vincent Guillou
Vincent Guillou

Reputation: 345

You do not need to use a behavior to share information between elements.

You should use IronMeta like so :

  • Declaratively and with data-binding :

<iron-meta key="my-unique-key" value="{{mySharedInformation}}"></iron-meta>

Then use mySharedInformation the same way you would any custom element's properties. Setting it will update the value of any other <iron-meta> in your code that shares the same key.

  • In plain javascript :

Read

var mySharedInformation = new Polymer.IronMeta().byKey('my-unique-key');

Write

new Polymer.IronMeta({key: 'my-unique-key', value: mySharedInformation});

Upvotes: 4

akc42
akc42

Reputation: 5001

Take a look at my object in github (https://github.com/akc42/akc-meta), it allows one element to publish a value with a key, and other ti have multiple instances subscribe to it and get the data out again.

It does it by keeping instances in a private variable

(function(){
var private;

Polymer({element definition has access to private});


})();

Upvotes: 2

Pascal Gula
Pascal Gula

Reputation: 1173

If you want to share an object between the different instances of your element, you have to avoid using a function as describe in the Documentation So this should be working as you expect:

<script>
  selectedBehavior = {
    properties: {
      selected: { 
        type: Object,
        value: { choice: 'home'} }
      }
    }
  }
</script>

Upvotes: 0

dman
dman

Reputation: 11064

I got it with this:

<script>
  selectedBehavior = {
    properties: {
      selected: { 
        type: Object,
        value: function() { return { choice: 'home'} }
      }
    }
  }
</script>

It seems specifying a object is not enough. I need to return a object for the value of object. Doesn't make alot of sense because in documentation I should just be able to say foo: Object. But, maybe this is a special case sense I am using it as a behavior.

Unfortunately, two elements can not share the same obj.property through behaviors. Each will have it's own instance.

Upvotes: 0

Related Questions