It was unnecessarily heavy and restrictive to wrap this library up as an Angular module. Please use the unwrapped version, here: typed-storage.
With Angular's dependency injection, the new usage looks like this:
The Angular 2 & 4 TypedStorage module provides an easy way to store and retrieve nested view models from browser storage (either localStorage or sessionStorage).
What it is not
localStorage = 653;// browser refresh...;// someValue == "314"
Will also work:
typedStorage.setItem"mykey", 653;// browser refresh...;// someValue == "314"
Will only work in modern browsers:
typedStorage = 653;// browser refresh...;// someValue == undefined
- It implements the Storage interface:
;s = sessionStorage;s = typedStorage;
- Allows optional namespacing in the underlying storage provider to avoid key collisions with other modules used by your application.
- Can use either string keys or instances of TypedStorageKey for better type safety.
// This presumes TypedStorage was configured with namespace com.example.myapp and localStorage:;;typedStorage.setItemmyKey, myInst;typedStorage = myInst; // property access will only work in modern browsers.// localStorage now contains key "com.example.myapp.myInst" with a JSON-serialized representation of myInst.// ...myInst = typedStorage.getItemmyKey;// ormyInst = typedStorage;typedStorage.removeItemmyKey;
We use SimpleMapper to recursively map deserialized objects back into their original view models. Nested models that you want mapped should use SimpleMapper's @mappable attribute.
Note: Each property must have a default value, otherwise SimpleMapper will not be able to detect the property at run-time. The Typescript,
undefined at run-time. Not even the property key will exist in the
npm install --save-dev angular-typed-storage inside of an Angular 4 project.
Inside your application's app.module.ts file, make the following additions.
// ...;// ...; // optional, if using VM refs instead of name strings.
The view models would all be exported via
index.ts "Barrels" (see Angular glossary):
And in your classes, import like this:
npm run build to build the project. The build artifacts will be stored in the
Running unit tests
npm test to execute the unit tests via Karma.
While running tests, code coverage will be available at ./coverage/chrome/html/index.html.
Run 'npm run compodoc' to generate documentation. Then run 'npm run compodoc-serve' to see auto-generated documentation and documentation coverage on port 8080.
Feel free to post issues.