पॉलिमर 1.0 - संपत्ति के साथ बाइंडिंग सीएसएस क्लास

Question

मैं आइटम की रंग बदलने के लिए अपनी संपत्ति के मूल्य के साथ paper-progress पर एक सीएसएस क्लास को बांधने का प्रयास करता हूं। मैं अपने कोड को पॉलिमर के उदाहरण पर GitHub पर और डेटा-बाइंडिंग के दस्तावेज़ पर आधारित करता हूं।

यहाँ मेरी कोड: http://jsbin.com/bidebe/10/edit?html,output

paper-progress परिवर्तन सही ढंग से वर्ग, लेकिन रंग नहीं करता है। यदि मैं सीधे कक्षा रंग डालता हूं, तो रंग सही होता है।

इसलिए मुझे समझ में नहीं आता कि मेरा paper-progress अच्छी कक्षा क्यों है लेकिन इसे लागू नहीं करता है। अगर कोई मुझे यह समझने में मदद कर सकता है, धन्यवाद।

Answer 1

यह शायद आपकी मदद करेगा।

 attached: function() { 
      this.async(function() { 
       var paperProgressArray = this.querySelectorAll('paper-progress');//get all paper-progress 
       var i = 0; 
       var j = paperProgressArray.length; 

       var color; 
       var secundary; 
       var paperProgress; 
       var dificulty; 
       while (i < j) { 
        paperProgress = paperProgressArray[i]; 
        dificulty = paperProgress.value; 
        if (0 <= dificulty && dificulty <= 4) { 
         color = 'red'; 
         secundary = "green"; 
        } else if (4 < dificulty && dificulty <= 7) { 
         color = 'green'; 
         secundary = "red"; 
        } else if (7 < dificulty && dificulty <= 10) { 
         color = 'yellow'; 
         secundary = "green"; 
        } 
         //set and update colors 
        paperProgress.customStyle['--paper-progress-active-color'] = color; 
        paperProgress.customStyle['--paper-progress-secondary-color'] = secundary; 
        this.updateStyles(); 
        i++; 
        } 
       }); 
      }, 

Answer 2

मैं इस वर्तमान व्यवहार बताते हैं और आप को प्राप्त करने के आप क्या चाहते हैं कुछ अन्य तरीके देता है लगता है https://www.polymer-project.org/1.0/docs/devguide/styling.html#custom-properties-shim---limitations-and-api-details