Polimer genel değişkenleri

Question

Bir RESTful API'den veri çeken ve arabirimi oluşturmak için kullanan bir Polimer uygulamasında çalışıyorum. Kavramsal olarak sıkıştığım belirli bir alan, http://www.polymer-project.org/docs/polymer/polymer.html#global'da açıklanan Monostate Pattern'in uygulanmasıdır. Etkili bir şekilde, yeni bir bileşen, uygulama globals'ına bildirimsel nitelikler ekleyebilir ve sonra bu mantıklı erişime kolayca erişebilirim.

İşte temel soru şu: temelde uygulama globals bileşeni içinde API-core ile a-line veri (ve potansiyel olarak yeniden gönderme) veriyorsam, uygulamanın tüm tüketicilerini nasıl temin ederim? globals bileşeni aynı verilere sahip mi? app-globaller API verilerinin kendi sürümünü çekerek olacak tüketmek bileşenlerinin her çünkü

<polymer-element name="my-component"> 
    <template> 
    <app-globals id="globals"></app-globals> 
    <div id="firstname"></div> 
    <div id="lastname"></div> 
    </template> 
    <script> 
    Polymer('my-component', { 
     ready: function() { this.globals = this.$.globals; } 
    }); 
    </script> 
</polymer-element>  

: Ben önerilen desen kullanırsanız benim monostatism kaybetmişim gibi görünüyor. Bir şey mi eksik? Uygulamanın sürekli gerçeğin sadece bir sürümüne sahip olduğundan emin olmanın başka bir yolu var mı?

Answer 1

Özel bir bileşendeki uygulama globals'larına her başvurduğunuzda, yeni uygulama globals örneği oluşturulur. Ancak bu örneklerin her biri birtakım özellikleri paylaşabilir (Java'da "statik" varyasyonları veya ObjC/Swift'deki "sınıf" varyasyonlarını düşünebilir).

Uygulama globals öğesi (ya da herhangi bir Polimer öğesi) içindeki Komut dosyası yalnızca bir kez çalışır - bileşen tanımı yüklendiğinde çalıştırıldığını düşünün. Ancak, bu betik içindeki Polimer işlevi, her örnek için ayrı ayrı oluşturulacak özellikler ve yaşam döngüsü olay işleyicileri olan bir yapılandırma nesnesini bildirir. Başvurulan belgede bulunan app-globals komut dosyası (UPDATE altında kopyalandı: bu sürüm daha sonra açıklanacaktır), hem paylaşılan değişkenleri hem de config nesnesini bildiren Polimer işlevini içeren anonim bir kapatma (hemen çalıştırılan bir işlev) kullanır. sırayla paylaşılan değişkenlere başvurur. Dolayısıyla, bu yapılandırma nesnesinin her bir örneği - ve her bir uygulama-globals örneği - aynı paylaşılan değişken grubunu referans gösterecektir.

<polymer-element name="app-globals"> 
    <script> 
    (function() { 
    var data = { 
     firstName: 'John', 
     lastName: 'Smith' 
    } 

    Polymer('app-globals', { 
     ready: function() { 
     this.data = data; 
     } 
    }); 
    })(); 
    </script> 
</polymer-element> 

bir özel bileşen örneği (ya da sizin durumunuzda bir AJAX çağrı sonucu olarak, dahili olarak değiştirilir) uygulamaya bir referansla tüm diğer bileşen örnekleri onun app-globaller örneğinde bir değeri değişirse -globals değişen değeri görecek.

GÜNCELLEME: Orijinal, kopyalanan olarak: @zreptil tarafından açıklanan

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

, bir eksiklik vardı veri değerleri değiştirmek durumunda, yeni değerler tüm diğer örneklerine YAPILAMAZ - çünkü örnek değişkenler başvurulan dizelerin yalnızca kopyalarıdır. Yukarıdaki özelliklerde olduğu gibi, veri özelliklerine sahip bir nesneyi kullanarak ve yalnızca nesnenin üzerine yazmak yerine o nesnenin veri özelliklerinden okuma ve atama yaparak, değiştirilen değerler örnekler arasında paylaşılabilir.

Answer 2

@Zreptil, yukarıdaki örneklerden birini sormuştu ve ben de bununla deneme yapmak zorunda olduğum için Tim Stewart'ın cevabı ve Polymer belgelerine dayanarak bir tane inşa ettim.

Komple Örnek:

http://jsbin.com/figizaxihe/1/edit?html,output ben kimliği (id="global-variable") içinde tire ile bazı sorunları vardı bu yüzden de bunun için bir örnek ekledi.

elemanı tanımı

<polymer-element name="app-globals"> 
<script> 
    (function() { 
    var data = { 
     firstName: 'John' 
    } 

    Polymer({ 
     ready: function() { 
     this.data = data; 
     } 
    }); 
    })(); 

</script> 
</polymer-element> 

<polymer-element name="output-element" noscript> 
<template> 
    <app-globals id="globalvars"></app-globals> 
    <h4>Output-Element</h4> 
    <div>First Name: {{$.globalvars.data.firstName}}</div> 
</template> 
</polymer-element> 

bir polimer unsuru

<template is="auto-binding"> 
    <app-globals id="topglobals"></app-globals> 
    <h3>First Name in Title: {{$.topglobals.data.firstName}}</h3> 
</template> 

dışında kullanın bir polimer elemanı içinde kullanın

<h3>and since that took me a while to realize - dashes are not directly supported...</h3> 
<template is="auto-binding"> 
    <!-- can use different id's --> 
    <app-globals id="global-variables"></app-globals> 
    <div>This does not work: {{$.global-variables.data.firstName}}</div> 
    <div>Correct syntax: {{$['global-variables'].data.firstName}}</div> 

</template> 

Polimer 1,0

eğer ilgi bir polimer 1.0 çözüm Polymer 1.0 Global Variables bakınız çizgi/tire

dikkat edin.