Re: [polymer-dev] Need help with data bindings

2018-01-04 Thread Ankit Singhal
That was it, thank you so much. Appreciate your quick response.

On Thu, Jan 4, 2018 at 5:29 PM, Karl Tiedt  wrote:

> properties are hyphenated because html attributes are case insensitive you
> need to use bank-info="{{checkingBankInfo}}" as per the documentation
> here: https://www.polymer-project.org/2.0/docs/devguide/data-binding in
> "Anatomy of a data binding"
>
> -Karl Tiedt
>
> On Thu, Jan 4, 2018 at 3:54 PM, Ankit Singhal 
> wrote:
>
>> Hi,
>>
>> I am very new to polymer and learning it. need your guidance as I develop
>> the application. I am struggling with data binding with in my components.
>> My requirement is very similar to Linking paths with data bindings.
>>
>> Parent element -
>>
>>
>> 
>>
>> > ="bankAccountDisplay">
>>
>> 
>>
>> 
>>
>> I have a custom element add-bank-account.html which is a child having
>> three property
>>
>> 
>>
>>
>> 
>>
>>
>> 
>>
>>
>> 
>>
>>
>> 
>>
>>
>> Changes in add-bank-account are not getting observed in checkingBankInfo
>> object of add-checking-account component.
>>
>>
>> I am expecting that as I have done 2 way binding so any changes to
>> property of bankInfo should be observed inside  checkingBankInfo
>> property of Parent component.
>>
>>
>> thanks for your help.
>>
>>
>>
>> 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+unsubscr...@googlegroups.com.
>> To view this discussion on the web visit https://groups.google.com/d/ms
>> gid/polymer-dev/6feee57b-7b67-4f1d-8dc3-93c679ce12a8%40googlegroups.com
>> 
>> .
>> For more options, visit https://groups.google.com/d/optout.
>>
>
>

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+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CAFttC-cFkdFcuVipEp3smBLZ%3DBevURaE%3DQ30aaMjd_BaYpu%3Dmg%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Need help with data bindings

2018-01-04 Thread Karl Tiedt
properties are hyphenated because html attributes are case insensitive you
need to use bank-info="{{checkingBankInfo}}" as per the documentation here:
https://www.polymer-project.org/2.0/docs/devguide/data-binding in "Anatomy
of a data binding"

-Karl Tiedt

On Thu, Jan 4, 2018 at 3:54 PM, Ankit Singhal 
wrote:

> Hi,
>
> I am very new to polymer and learning it. need your guidance as I develop
> the application. I am struggling with data binding with in my components.
> My requirement is very similar to Linking paths with data bindings.
>
> Parent element -
>
>
> 
>
>  ="bankAccountDisplay">
>
> 
>
> 
>
> I have a custom element add-bank-account.html which is a child having
> three property
>
> 
>
>
> 
>
>
> 
>
>
> 
>
>
> 
>
>
> Changes in add-bank-account are not getting observed in checkingBankInfo
> object of add-checking-account component.
>
>
> I am expecting that as I have done 2 way binding so any changes to
> property of bankInfo should be observed inside  checkingBankInfo property
> of Parent component.
>
>
> thanks for your help.
>
>
>
> 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+unsubscr...@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/
> msgid/polymer-dev/6feee57b-7b67-4f1d-8dc3-93c679ce12a8%40googlegroups.com
> 
> .
> For more options, visit https://groups.google.com/d/optout.
>

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+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/CADNgbTFtby7QxZ8bApxmqsm8WsY%2Bx3apA3gQZhoNxFogCD3u5g%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.


[polymer-dev] Need help with data bindings

2018-01-04 Thread Ankit Singhal
Hi,

I am very new to polymer and learning it. need your guidance as I develop 
the application. I am struggling with data binding with in my components. 
My requirement is very similar to Linking paths with data bindings.

Parent element - 




 





I have a custom element add-bank-account.html which is a child having three 
property 
















Changes in add-bank-account are not getting observed in checkingBankInfo 
object of add-checking-account component.   


I am expecting that as I have done 2 way binding so any changes to property 
of bankInfo should be observed inside  checkingBankInfo property of Parent 
component.


thanks for your help.



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+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/6feee57b-7b67-4f1d-8dc3-93c679ce12a8%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.


Re: [polymer-dev] Multiple instances of elements seem to be sharing property values ?

2018-01-04 Thread Lars Knudsen
I think this should rather be explained clearly in the guidelines. It is a
valuable thing when needed

On Jan 4, 2018 07:57,  wrote:

> Totally agree. Many developers won't know this after they finish reading
> the tutorial. It's like learning Python without being warned of the
> differences between class variables and instance variables.
> To keep a shared state across multiple same type of elements, is not a
> daily demand, but will cause potential troubles in a daily work.
>
> On Wednesday, April 12, 2017 at 5:49:07 PM UTC+2, mpa...@ugcloud.ca wrote:
>>
>> I agree fully with Toni, Polymer is designed to help make web components,
>> and I thought the idea of a web component is that is isolated.  This make
>> it easy to test and re-use etc.  If having multiple copies of an element
>> changes the behavior of it that would makes this harder to test and not
>> intuitive.  I can see people not testing multiple copies of their elements,
>> I have created 8 elements and it wasn't until my 9th one I noticed this
>> issue.  I now have to go back and double check everything.
>>
>> I would actually suggest removing the static array (object) option
>> completely, as you can simple use a parent object to handle this kind of
>> situation, and I think this would be the minority of cases anyway.
>>
>> On Sunday, October 23, 2016 at 3:59:14 PM UTC-4, Toni wrote:
>>>
>>> Although this question is a few months old, I ran into this problem just
>>> now and was not able to solve it immediately with the explanation given. So
>>> for anyone still having issues with this, here is the solution (without
>>> telling you to go anywhere else and try to find it in the documentation...):
>>>
>>> 1. By default, properties of Polymer objects are shared across all
>>> instances of the object (or, to be more precise, all references to the
>>> object, since Polymer doesn't create new instances, as in "new Element()").
>>> Basically, all properties are by default static.
>>> 2. Every property that is supposed to be individual to the specific
>>> reference, in other words, be not static, and changable without messing
>>> with any other instance/reference, has to have the field "value: function()
>>> { return []; }".
>>> 3. Example:
>>>
>>> Polymer({
>>> is: 'txt-carousel-view',
>>> properties: {
>>> myOwnList: {
>>> value: function() { return []; } // this is a non-static
>>> array, invididual and fresh for every instance
>>> },
>>> mySharedList: {
>>> value: []; // this is a static array, shared with every
>>> instance array
>>> }
>>> }
>>> })
>>>
>>> As a Polymer newbie, I assumed that every instance of an Polymer element
>>> in HTML would be handled as a separate instance code-wise. For me, it would
>>> have been more intuitive that properties are "fresh", except I declare them
>>> explicitly to be static. (Since ES6 is moving Javascript more towards OOP,
>>> I'd like to see the Polymer team to at least consider making Polymer
>>> attributes non-static by default.)
>>>
>>> On Friday, March 18, 2016 at 4:08:59 PM UTC+1, Karl Tiedt wrote:

 Read the docs on properties and you'll see a statement about using:

 value: function() { return []; }

 In relation to arrays and objects with the appropriate change to the
 function.
 On Mar 18, 2016 07:42, "Rob Stone"  wrote:

> I've just discovered something that is a little confusing and was
> hoping a polymer expert could explain what is going on :)
>
> I've defined an element with an array property (initialised to empty)
> with an attach method that then uses 'this.push' to add items to the 
> array.
> If I then create multiple instances of the element, in the browser 
> debugger
> it looks like the array is shared across all of these instances as each
> subsequent copy of the element seems to inherit the array values from
> previous elements. What's even more confusing is that if I create a
> dom-repeat that iterates over the array, it shows the 'correct' values for
> each instance, ie. it seems to be using an array that doesn't have
> duplicate values in it.
>
> I have a very small test project that shows this problem, however I
> haven't got anywhere to host it so cannot put a link up.
>
> Cut down code follows:
>
> 
> 
> 
> 
> [[item]]
> 
> 
>
>
> 
> (function () {
> Polymer({
> is: 'test-element',
> properties: {
> items: {
> type: Array,
> value: []
> }
> },
>
>
> attached: function () {
> console.log('attached');
> this.push('items', "1");
>