jimmy-collazos / lit-directive-subject

This is a directive of lit-html for update (async mode) parts of your template. Change any part of your template without re-rendering

Subject part directive of [lit-html]

This is a directive of lit-html for update (async mode) parts of your template. Change any part of your template without re-rendering.

🔗 See the demo

Installation

Install from NPM or use from Unpkg CDN

Npm

npm install --save lit-directive-subject

Unpkg

import {SubjetPartial} from 'https://unpkg.com/lit-directive-subject?module'

API

SubjetPartial

This is a class for create new partial context for updating in async mode.

Methods:

• part(): directive for rendering values in you template
• setValue(value): Set any value for rendering in your template
• commit(): Commit the current value and force to update template.

Example:

import {render, html} from 'lit-html'
import {SubjectPartial} from 'lit-directive-subject';

const partial = new SubjectPartial();

render(html`
  <h1>Demo</h1>
  <div>
    ${partial.part()}
  </div>
  `, window.container);


// Async updating
(function update() {
  partial.setValue(Math.random())
  partial.commit();
  setTimeout(update, 1000);
})();