- Exciting release!Introducing "safe npm". Learn more →
@s-libs/ng-app-state
Advanced tools
- Version published
- Maintainers
- 1
- Weekly downloads
- 757
- increased by2.71%
Weekly downloads
Changelog
Readme
Painlessly integrate app-state into template-driven Angular forms.
Installation
Install along with its peer dependencies using:
npm install --save @s-libs/ng-app-state @s-libs/app-state @s-libs/ng-core @s-libs/rxjs-core @s-libs/js-core @s-libs/micro-dash
# OR
yarn add @s-libs/ng-app-state @s-libs/app-state @s-libs/ng-core @s-libs/rxjs-core @s-libs/js-core @s-libs/micro-dash
Setup
In your module, import NasModelModule, e.g.:
// app.module.ts
import { NasModelModule } from "@s-libs/ng-app-state";
@NgModule({
imports: [NasModelModule],
})
export class AppModule {}
Template Driven Forms
This library includes the [nasModel] directive that you can use in place of [(ngModel)] to bind form controls directly to store objects. For example, to edit the current user's name in the example above:
@Component({
template: `<input [nasModel]="nameStore" />`,
})
class AccountSettingsComponent {
nameStore: Store<string>;
constructor(myStore: MyStore) {
this.nameStore = myStore("currentUser")("name");
}
}
[nasModel] is tested to work with all standard form controls. Except where noted, they all bind to Store<string> objects.
<input type="checkbox">- binds toStore<boolean><input type="color"><input type="date"><input type="datetime-local"><input type="email"><input type="month"><input type="number">- binds toStore<number><input type="password"><input type="radio"><input type="range">- binds toStore<number><input type="search"><input type="tel"><input type="text"><input type="time"><input type="url"><input type="week"><input><select multiple>- binds toStore<string[]><select><textarea>
FAQs
Painlessly integrate [`app-state`](https://github.com/simontonsoftware/s-libs/projects/app-state) into template-driven Angular forms.
The npm package @s-libs/ng-app-state receives a total of 639 weekly downloads. As such, @s-libs/ng-app-state popularity was classified as not popular.
We found that @s-libs/ng-app-state demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.