<commit_before># angular async cache
[![Build Status](https://travis-ci.org/mattlewis92/angular-async-cache.svg?branch=master)](https://travis-ci.org/mattlewis92/angular-async-cache)
[![npm version](https://badge.fury.io/js/angular-async-cache.svg)](http://badge.fury.io/js/angular-async-cache)
[![devDependency Status](https://david-dm.org/mattlewis92/angular-async-cache/dev-status.svg)](https://david-dm.org/mattlewis92/angular-async-cache#info=devDependencies)
[![GitHub issues](https://img.shields.io/github/issues/mattlewis92/angular-async-cache.svg)](https://github.com/mattlewis92/angular-async-cache/issues)
[![GitHub stars](https://img.shields.io/github/stars/mattlewis92/angular-async-cache.svg)](https://github.com/mattlewis92/angular-async-cache/stargazers)
[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/mattlewis92/angular-async-cache/master/LICENSE)

## Table of contents

- [About](#about)
- [Installation](#installation)
- [Documentation](#documentation)
- [Development](#development)
- [License](#licence)

## About

A simple utility to help with caching of promises and observables to enable an easy offline first approach in angular 2.0+ apps

## Installation

Install through npm:
```
npm install --save angular-async-cache
```

Sample usage

```typescript
import { NgModule, Component, Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { AsyncCache, LocalStorageDriver, MemoryDriver, AsyncCacheModule, AsyncCacheOptions } from 'angular-async-cache';

export function asyncCacheOptionsFactory() {
  return new AsyncCacheOptions({
    driver: new LocalStorageDriver(), // default cache driver to use. Default in memory. You can also roll your own by implementing the CacheDriver interface
    fromCacheAndReplay: true // this is the special sauce - first emit the data from localstorage, then re-fetch the live data from the API and emit a second time. The async pipe will then re-render and update the UI
  });
}

// declare in your module
@NgModule({
  imports: [
    AsyncCacheModule.forRoot({
      provide: AsyncCacheOptions,
      useFactory: asyncCacheOptionsFactory
    })
  ]
})
class MyModule {}

// use in your service
@Injectable()
class CarService {

  constructor(
    private http: Http, 
    private asyncCache: AsyncCache, 
    private memoryDriver: MemoryDriver
  ) {}
  
  getCars(): Observable<Car[]> {
  
    const cars$: Observable<Car[]> = this.http.get('/cars').map(res => res.json());
    return asyncCache.wrap(cars$, '/cars', {<commit_msg>docs: add missing type<commit_after># angular async cache
[![Build Status](https://travis-ci.org/mattlewis92/angular-async-cache.svg?branch=master)](https://travis-ci.org/mattlewis92/angular-async-cache)
[![npm version](https://badge.fury.io/js/angular-async-cache.svg)](http://badge.fury.io/js/angular-async-cache)
[![devDependency Status](https://david-dm.org/mattlewis92/angular-async-cache/dev-status.svg)](https://david-dm.org/mattlewis92/angular-async-cache#info=devDependencies)
[![GitHub issues](https://img.shields.io/github/issues/mattlewis92/angular-async-cache.svg)](https://github.com/mattlewis92/angular-async-cache/issues)
[![GitHub stars](https://img.shields.io/github/stars/mattlewis92/angular-async-cache.svg)](https://github.com/mattlewis92/angular-async-cache/stargazers)
[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://raw.githubusercontent.com/mattlewis92/angular-async-cache/master/LICENSE)

## Table of contents

- [About](#about)
- [Installation](#installation)
- [Documentation](#documentation)
- [Development](#development)
- [License](#licence)

## About

A simple utility to help with caching of promises and observables to enable an easy offline first approach in angular 2.0+ apps

## Installation

Install through npm:
```
npm install --save angular-async-cache
```

Sample usage

```typescript
import { NgModule, Component, Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { AsyncCache, LocalStorageDriver, MemoryDriver, AsyncCacheModule, AsyncCacheOptions } from 'angular-async-cache';

export function asyncCacheOptionsFactory(): AsyncCacheOptions {
  return new AsyncCacheOptions({
    driver: new LocalStorageDriver(), // default cache driver to use. Default in memory. You can also roll your own by implementing the CacheDriver interface
    fromCacheAndReplay: true // this is the special sauce - first emit the data from localstorage, then re-fetch the live data from the API and emit a second time. The async pipe will then re-render and update the UI
  });
}

// declare in your module
@NgModule({
  imports: [
    AsyncCacheModule.forRoot({
      provide: AsyncCacheOptions,
      useFactory: asyncCacheOptionsFactory
    })
  ]
})
class MyModule {}

// use in your service
@Injectable()
class CarService {

  constructor(
    private http: Http, 
    private asyncCache: AsyncCache, 
    private memoryDriver: MemoryDriver
  ) {}
  
  getCars(): Observable<Car[]> {
  
    const cars$: Observable<Car[]> = this.http.get('/cars').map(res => res.json());
    return asyncCache.wrap(cars$, '/cars', {
{'fraction_non_alphanumeric': 0.14059482425646969, 'fraction_numerical': 0.00772499034376207, 'mean_word_length': 4.8125701459034795, 'pattern_counts': {'":': 0, '<': 7, '<?xml version=': 0, '>': 9, 'https://': 22, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 2, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2287992', 'n_tokens_mistral': 1652, 'n_tokens_neox': 1561, 'n_words': 364}