Home

Awesome

<!-- markdownlint-disable MD024 MD031 -->

Lithium for Angular (@lithiumjs/angular)

Coverage

Reactive components made easy! Lithium provides utilities that enable seamless reactive state and event interactions for Angular components.

Features

import { ComponentState, ComponentStateRef } from '@lithiumjs/angular';

@Component({
    ...
    providers: [ComponentState.create(MyComponent)]
})
class MyComponent {

    public value = 0;

    constructor (stateRef: ComponentStateRef<MyComponent>) {
        stateRef.get('value').subscribe(value => console.log("value: ", value));

        this.value = 100;
    }

    // Output:
    // value: 0
    // value: 100
}
import { OnInit } from '@lithiumjs/angular';

@Component({...})
class MyComponent {

    @OnInit() 
    private readonly onInit$: Observable<void>;

    constructor () {
        this.onInit$.subscribe(() => console.log("Reactive ngOnInit!"));
    }
}

Intro guide

Read through the intro guide to get to know Lithium's core features.

Example app - [Live demo]

The example todo list app showcases real-world usages of Lithium.

API reference

Full API documentation is available for Lithium.

Installation

Lithium can be installed via npm using the following command:

npm install @lithiumjs/angular

FAQ and Other information

If you are upgrading from Lithium 6.x or earlier, read through the migration guide to see how to updgrade your app to use the latest features from Lithium.

FAQ

Does Lithium support Ivy (the default rendering engine for Angular 9+)?

Lithium fully supports Ivy-based applications. Note: Please be aware that Lithium currently uses features from the not-yet finialized Ivy API, so some features of Lithium could stop working in later versions of Angular before Lithium is updated to support them.

Does Lithium support the ViewEngine (pre-Ivy) applications?

Lithium 5.x.x is the last major version that supports ViewEngine-based applications. Lithium 6.x.x and above only supports Ivy-based applications.

Other information