Properties And Attributes


The custom element specification allows the use of properties and attributes in a custom element.
Polymer properties make it easy to use and add to their capabilities giving you more power when building components.
Properties can be declared with their properties type and a default value.

\\Syntax
static get properties() {
          return  {
    property_Name:data_Type,
          }
     }

----------------------------------------------------------------

\\Example :-
static get properties() {
  return {
    lfcName: {
      type: String,
      value: 'Letsfindcourse'
    }
  };
}

*A property with a name of lfcName is defined.*

If we have an attribute on a custom element that is named as a property name, then the value of that attribute will be set to the value of the property with the polymer.

\\Syntax

< template-name property-name=“value”>

--------------------------------------------------------

\\Example

< my-element gator-name="Lfc_courses">

* This will override the default value of gatorName with Lfc_courses *

Property keys

Key Description Type
type Type is used for transforming the data defined in an template attribute into a property value. Boolean, Date, Number, String, Array or Object
value Value is the default value for the property and it can be useful when we need a default behaviour. boolean, number, string or function
reflectToAttribute reflectToAttribute can be especially useful for styling on condition.If this key value set to true, then whenever the property value changes cause the corresponding attribute to set on the host node. boolean
readOnly readOnly prevents attribute values from mapping onto the property. boolean
computed The value is interpreted as a method name and argument list. string
notify notify properties are automatically data bound and when notify is true, we can get Polymer to fire events on property value changes. boolean
observer It will be invoked when the property value changes. string




Visit :


Discussion


* You must be logged in to add comment.