Skip to main content

Style Attribute

The $style directive is used to dynamically apply inline styles to elements based on data properties.

Usage

~index.html
<div $style="color:{textColor},background-color:{bgColor}">Content</div>

How it Works

  • The framework parses the $style attribute, splitting it into style property-value pairs. It sets up watchers for the referenced data properties.

  • When a property changes, the corresponding style is updated.

  • The element's inline styles are dynamically modified.

Error Handling

If a referenced property doesn't exist, the style might not be applied, and a warning could be logged to the console.

Note

note

This directive allows for dynamic styling without the need for complex CSS classes or manual style manipulation in JavaScript.