https://github.com/jsayol/ngx-local
Structural directive for Angular 2.x+ to locally store a value in a template input variable
https://github.com/jsayol/ngx-local
angular angular2 async ngx typescript
Last synced: 9 months ago
JSON representation
Structural directive for Angular 2.x+ to locally store a value in a template input variable
- Host: GitHub
- URL: https://github.com/jsayol/ngx-local
- Owner: jsayol
- License: mit
- Created: 2016-12-23T01:03:09.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-12-26T00:04:58.000Z (over 9 years ago)
- Last Synced: 2025-02-14T01:29:56.894Z (about 1 year ago)
- Topics: angular, angular2, async, ngx, typescript
- Language: TypeScript
- Homepage:
- Size: 8.79 KB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# ngx-local
[](https://www.npmjs.com/package/ngx-local)
[MIT License](LICENSE.txt)
Structural directive for Angular 2.x+ to locally store a value in a template input variable.
This is particularly useful when used in conjunction with the 'async' pipe:
```html
id: {{ user?.id }}
name: {{ user?.name }}
username: {{ user?.username }}
email: {{ user?.email }}
```
## Installation
Via npm
```
npm install ngx-local --save
```
Via yarn
```
yarn add ngx-local
```
Then add the directive to your app.module.ts:
```ts
// ...
import { NgxLocal } from 'ngx-local';
@NgModule({
// ...
declarations: [
// ...
NgxLocal
],
// ...
})
export class AppModule {
}
```
## Sample usage
```ts
import { Component } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
@Component({
selector: 'my-app',
template: `
id: {{ user?.id }}
name: {{ user?.name }}
username: {{ user?.username }}
email: {{ user?.email }}
`,
})
export class AppComponent {
httpUser$: Observable;
constructor(private http: Http) {
const randomUserId = Math.floor(Math.random() * 10) + 1;
this.httpUser$ = this.http
.get(`https://jsonplaceholder.typicode.com/users/${randomUserId}`)
.map((res: Response): User => res.json() || {});
};
}
export interface User {
id: number;
name: string;
username: string;
email: string;
}
```
## TO-DO
- [x] Release!
- [ ] **Add tests**