gilf / angular2-indexeddb Goto Github PK
View Code? Open in Web Editor NEWangular2-indexeddb is a library that wraps indexeddb database in an Angular service.
License: MIT License
angular2-indexeddb is a library that wraps indexeddb database in an Angular service.
License: MIT License
i just want to use read-more-directive-angular2 .but it shows
WARNING in /home/veluvijay/web__app/client-frontend/node_modules/read-more-directive-angular2/node_modules/@angular/core/@angular/core.es5.js 5659:15-36 Critical dependency: the request of a dependency is an expression
I tried indexed db in IE Edge but it is giving Data Error
Im using Angular cli 1.0. When i try to build it gives out these Errors
ERROR in Error encountered resolving symbol values statically. Calling function 'makeDecorator', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol Injectable in /Library/WebServer/www/coop/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/metadata.d.ts, resolving symbol OpaqueToken in /Library/WebServer/www/coop/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/opaque_token.d.ts, resolving symbol OpaqueToken in /Library/WebServer/www/coop/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/opaque_token.d.ts
Facing this issue in ng build
Error in /node_modules/angular2-indexeddb/angular2-indexeddb.ts (81,58): Argument of type 'str
ing' is not assignable to parameter of type 'IDBCursorDirection'.
ERROR in /node_modules/angular2-indexeddb/angular2-indexeddb.ts (311,76): Argument of type 'st
ring' is not assignable to parameter of type 'IDBTransactionMode'.
package.json:
"typescript": "^2.4.2"
"angular/cli": "^1.2.6",
"angular/common": "^4.3.2",
"angular/compiler": "^4.3.2",
"angular/compiler-cli": "^4.3.2",
"angular/core": "^4.3.2",
Using @Injectable denotes you want to use DI, yet your constructor has two primitive type mandatory parameters which are not wrapped in Inject so can't be injected. This isn't compatible with Angular 5 and gives an error:
Warning: Can't resolve all parameters for AngularIndexedDB in node_modules/angular2-indexeddb/angular2-indexeddb.ts: (?, ?). This will become an error in Angular v5.x
Why not simply remove the Injectable decorator, or make the class an injectable service?
I am attempting to migrate my Angular 4.x project to 5 and this warning shows. When I upgrade to Angular 5, sure enough it breaks with this error. Is anybody else encountering this?
"Can't resolve all parameters for AngularIndexedDB in C:/Users/peter/git/Hyperion3/MyApp/node_modules/angular2-indexeddb/angular2-indexeddb.ts: (?, ?). This will become an error in Angular v5.x"
Was trying to get by index, but only returns a item, i need to get an array of items like
index.getAll(value);
is there any way in the actual implementation?
Thanks!!
I added the angular2-indexeddb.ts file in my project, so that I can import AngularIndexedDB. However I am getting 15 compilation errors when I added the class in webstorm IDE. The errors are mainly on the readonly attribute of DbMode class, result variable used in getByIndex and getAll methods. My dependencies are
"dependencies": {
"angular2": "2.0.0-beta.13",
"systemjs": "0.19.25",
"es6-shim": "^0.35.0",
"ng2-bootstrap": "^1.0.10",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.2",
"zone.js": "0.6.6"
},
"devDependencies": {
"concurrently": "^2.0.0",
"typescript": "^1.8.9",
"es6-promise": "^3.0.2",
"typings":"^0.7.11",
"autoprefixer": "^6.2.1",
"cssnano": "^3.4.0",
"gulp": "^3.9.0",
"gulp-ext-replace": "^0.2.0",
"gulp-imagemin": "^2.4.0",
"gulp-postcss": "^6.0.1",
"gulp-sourcemaps": "^1.6.0",
"gulp-typescript": "^2.10.0",
"gulp-uglify": "^1.5.1",
"postcss": "^5.0.13",
"postcss-scss": "^0.1.3",
"precss": "^1.3.0",
"gulp-webserver": "^0.9.1"
}
I am eager to use it, please help me to resolve these issues.
Every time when I add new value into database that returned below error.
DOMException: Failed to execute 'add' on 'IDBObjectStore': Evaluating the object store's key path did not yield a value.
Here is the code snippet that I used for insert new value.
let db = new AngularIndexedDB('myDb', 1);
db.createStore(1, (evt) => {
const objectStore = evt.currentTarget.result.createObjectStore('people', { keyPath: 'id', unique: true });
objectStore.createIndex("name", "name", { unique: false });
objectStore.createIndex("email", "email", { unique: true });
}).then(() => {
db.add('people', { name: "test", email: "test" }).then(() => {
}, (error) => {
console.log(error);
});
}, (error) => {
console.log(error);
});
Would you please help to resolve this issue ?
Can you please provide a simple example how to make angular2-indexeddb
working with Angular (Version 4!)?
I've created an new project with ng new test-angular2-indexeddb
and installed angular2-indexeddb
with npm install angular2-indexeddb
.
The following code produces the error You need to use the createStore function to create a database before you query it!
:
import {Component, OnInit} from '@angular/core';
import {AngularIndexedDB} from 'angular2-indexeddb';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
title = 'app works3!';
ngOnInit(): void {
let db = new AngularIndexedDB('myDb', 1);
db.createStore(1, (evt) => {
console.log(evt); // <- this is never reached!
let objectStore = evt.currentTarget.result.createObjectStore(
'people', {keyPath: 'id', autoIncrement: true});
objectStore.createIndex('name', 'name', {unique: false});
objectStore.createIndex('email', 'email', {unique: true});
});
db.getByKey('people', 1).then((person) => {
console.log(person);
}, (error) => {
console.log(error);
});
}
}
Other users in your blog are reporting this not working and asking for a working example.
return new Promise((resolve, reject) => {
this.db.add(tableName, data).then((evt) => {
resolve("success");
}, (error) => {
console.log(error);
reject('fail');
});
});
After insert a new item than callback not return updated id value . How can I get the callback for updated id value?
Are you guys aware that the "remove" method doesn't exists in the API ?
"db.remove ..."
I got lucky trying the db.delete method instead.
The docs should be updated, if i'm not wrong...
Cheers!
I've been trying to use add() to insert into the DB but I get a [object DOMException]: {code:0, message:"DataError", name:"DataError"} exception every time its called.
I saw a previous issue that looks the same but is closed, it suggested adding in the key but that hasn't worked for me.
This is happening with the current version of Edge on windows and on Windows Phone.
How can I drop the database schema, in this case the object store? I want to recreate each time the object store.
getAll method fetch items but it does not really provide a way to index and order by in ascending or descending order while iterating over the objects
can we have implementation to index and order something like this
`getAll(storeName: string,indexBy:string,Order:string = "asc") {
let self = this;
let promise = new Promise((resolve, reject)=> {
self.dbWrapper.validateBeforeTransaction(storeName, reject);
let transaction = self.dbWrapper.createTransaction({ storeName: storeName,
dbMode: self.utils.dbMode.readOnly,
error: (e: Event) => {
reject(e);
},
complete: (e: Event) => {
}
}),
objectStore = transaction.objectStore(storeName),
result = [],
if(indexBy){
let Ord = (Order === 'desc')? 'prev' : 'next';
request = objectStore.index(indexBy).openCursor(null,Ord);
}else {
request = objectStore.openCursor();
}
request.onerror = function (e) {
reject(e);
};`
client?cd17:80 .//angular2-indexeddb/angular2-indexeddb.ts/angular2-indexeddb/index.ts 1:0-37
Module parse failed:node_modules/angular2-indexeddb/angular2-indexeddb.ts Unexpected character '@' (5:0)
You may need an appropriate loader to handle this file type.
| import {Injectable} from '@angular/core';
|
| @Injectable()
| export class AngularIndexedDB {
| private utils: Utils;
@ ./
@ ./src/app/app.module.ts
@ ./src/main.browser.ts
@ multi app
I have a JSON file with more 200 thousands items.
I slice it reducing it in smallest array length, and I iterate calling "db.add". I have a memory crash using Chrome but I haven't problems until 100 thousands items (of course waiting a lot of minutes to complete the insertion).
What's the best practice for massive insert?
I have created the database using constructor. and used the same reference to add the element but i got this error. How could I resolve it.
/**
@Injectable()
export class productService{
private products:product[];
db:any;
objectStore:any;
constructor(){
this.db = new AngularIndexedDB("@Productdb",1);
this.db.createStore(1,(evt)=>{
this.objectStore = evt.currentTarget.result.createObjectStore('products',{keyPath:"_generatedKey"});
this.objectStore.createIndex("productId","productId",{unique:true});
this.objectStore.createIndex("productName","productName",{unique:false});
});
}
setProducts(_product:any[]):void{
console.log(_product.length);
this.products = new Array(_product.length);
for(let i=0;i<_product.length;i++){
this.products.push(new product(_product[i].id,_product[i].name,_product[i].price,_product[i].price,_product[i].tags,_product[i].description));
}
/* var productObjectStore = this.db.transaction("products","readwrite").objectStore("products");*/
for(var j in this.products)
{
console.log(JSON.stringify(this.products[j]));
// productObjectStore.add(this.products[j]);
this.db.add('products',this.products[j]);
}
}
}
i am new in using this service and i go through the examples and try to create my example but every time i load the application this errors showed up :
in [at-loader] ./node_modules/angular2-indexeddb/angular2-indexeddb.ts:265:9
TS2322: Type 'null' is not assignable to type 'IDBDatabase'.
ERROR in [at-loader] ./node_modules/angular2-indexeddb/angular2-indexeddb.ts:285:9
TS2322: Type '((e: Event) => any) | undefined' is not assignable to type '(this: IDBTransaction, ev: Event) => any'.
Type 'undefined' is not assignable to type '(this: IDBTransaction, ev: Event) => any'.
Could you help me please finding the reason of these errors.
I see that I can get items array from key range by getAll()
and W3C API also have API for do this with index range. I'm not sure how to do this with your API. I try read your source and assume that it not support?
Hi,
First thank you for sharing this library 👍
I have created a source component to experiment: off-site.component.txt
These functions are perfectly working:
Nevertheless the other functions doesn't seem to work as they all return "undefined"
I have copied exactly the samples you described (nevertheless I might be doing something wrong)
Thanks in advance for your answer.
Regards,
Ben
hi,
i have this:
// Get all users in the database.
getAllUsers() {
this.db.getAll('users').then((users) => {
console.log(users); // if i do return users; i get nothing.
}, (error) => {
console.log(error);
});
}
how can i pass the users array to my component.
in my component i have this:
const users: any = this.i.getAllUsers();
etc. etc.
thank you
In the file 'README.md ' I can read:
db.openCursor('people', (evt) => {
var cursor = evt.target.result;
if(cursor) {
console.log(cursor.value);
cursor.continue();
} else {
console.log('Entries all displayed.');
}
}, IDBKeyRange.bound("A", "F"));
But, I have an error on the line
var cursor = evt.target.result;
i want to create an object with createStore but it failure
error contains : The keyPath argument contains an invalid key path
anyone can hears me ?!
I use this seed for starter project. https://github.com/vyakymenko/angular2-seed-express
but i stuck with configuration of indexdb on production build it get Error on fetch for angular2-indexeddb.js.
i cant understand how to solve this, could u please help me out.....
error:-
[18:45:25] 'build.bundles.app' errored after 2.82 s
[18:45:25] Error on fetch for angular2-indexeddb.js at file:///home/node_modules/angular2-indexeddb.js
Loading dist/tmp_client/app//db-service/db.service.js
Loading dist/tmp_client/app/app.module.js
Loading dist/tmp_client/app/main.js
Error: ENOENT: no such file or directory, open '/home/node_modules/angular2-indexeddb.js'
at Error (native)
[18:45:25] 'build.prod' errored after 33 s
[18:45:25] Error in plugin 'run-sequence(build.bundles.app)'
Message:
Error on fetch for angular2-indexeddb.js at file:///home/node_modules/angular2-indexeddb.js
Loading dist/tmp_client/app/qeasily/framework/db-service/db.service.js
Loading dist/tmp_client/app/app.module.js
Loading dist/tmp_client/app/main.js
ENOENT: no such file or directory, open '/home/node_modules/angular2-indexeddb.js'
Details:
originalErr: Error: ENOENT: no such file or directory, open '/home/node_modules/angular2-indexeddb.js'
Stack:
Error on fetch for angular2-indexeddb.js at file:///home/chetan/node_modules/angular2-indexeddb.js
Loading dist/tmp_client/app/framework/db-service/db.service.js
Loading dist/tmp_client/app/app.module.js
Loading dist/tmp_client/app/main.js
Error: ENOENT: no such file or directory, open '/home/chetan/node_modules/angular2-indexeddb.js'
at Error (native)
I am trying to have 2 stores in a single database. But I unable to do so. Documentation only shows how to create a store.
I tried to use the sample code provided:
let db = new AngularIndexedDB("myDb", 1);
db.createStore(1, (evt) => {
let objectStore = evt.currentTarget.result.createObjectStore(
"people", { keyPath: "id", autoIncrement: true });
objectStore.createIndex("name", "name", { unique: false });
objectStore.createIndex("email", "email", { unique: true });
});
db.createStore(2, (evt) => {
let objectStore2 = evt.currentTarget.result.createObjectStore(
"pets", { keyPath: "id", autoIncrement: true });
});
But it does not work. Am I doing something wrong??
db.createStore(1, (evt) => {
let objectStore = evt.currentTarget.result.createObjectStore(
'org', { keyPath: "id", autoIncrement: true });
});
db.add('org', data).then((item)=>{
console.log(item);
}, error=>{
console.error(error);
})
Value of item:
{
key:undefined,
value: {
name: "orgname"
}
}
Value of key is undefined
How could i get that.
i want to create more than one object store with same indexses but stuck with error objectStore does not exists .
this.dbService.createDB('skillcontext', (evt:any)=> {
console.log('---------------------1--------------------------------');
});
this.dbService.createDB('math', (evt:any)=> {
console.log('---------------------2--------------------------------');
});
math object store is created all time but stuck on skillcontext object
Getting below warning while making build
Warning: Can't resolve all parameters for AngularIndexedDB in angular/node_modules/angular2-indexeddb/angular2-indexeddb.ts: (?, ?). This will become an error in Angular v5.x
Will it be problematic when angular is upgraded in future ?
I get the following errors when i try to build my angular app... Any suggestions?
.../node_modules/angular2-indexeddb/angular2-indexeddb.ts (81,58): Argument of type 'string' is not assignable to parameter of type 'IDBCursorDirection'.
.../node_modules/angular2-indexeddb/angular2-indexeddb.ts (311,76): Argument of type 'string' is not assignable to parameter of type 'IDBTransactionMode'.
Found an issue today; more on my part. Fixed by using the following coding pattern for createStore instead of the one shown in the doco. Thanks for your initiative. good job :)
FYI, i am using the async pattern (that is why you see the cb (null or err) pattern)
vm.db.createStore(1, function(upgrade){
; // late update: don't forget to do the usual stuff here.
// treat the upgrade as evt. and we call createObjectStore here.
}).then((evt) => {
if (evt) {
// updated: superflous as evt is alaways null. but just in case
let objectStore = evt.currentTarget.result.createObjectStore('mydb', { keyPath: "id", autoIncrement: true });
console.log("indexedDB.created ...");
}
else {
console.log("indexedDB.opened ...");
}
return cb(null);
}, function (err) {
console.log("indexedDB.failed to initialize ...", err);
return cb(err);
});
I right understood? I will install indexeddb and install angular2-indexeddb? If right, How install indexeddb?
I am not sure if I just didn't understand it corecctly or if there is an error in the implementation.
this.database = new AngularIndexedDB('db', 3);
this.database.openDatabase(3,
(evt) => {
console.log("version 3");
}(error) => {
console.log(error);
}
);
this.database.openDatabase(2,
(evt) => {
console.log("version 2");
}(error) => {
console.log(error);
}
)
I expected the following behavior:
But the behavior is, that I get an error as soon as I try to open a database with a different version then I initialized it. So in this example openDatabase(2,....) would throw the error.
The error is:
ERROR Error: Uncaught (in promise): IndexedDB error: undefined
at resolvePromise (zone.js:809)
at eval (zone.js:728)
at IDBOpenDBRequest.request.onerror [as __zone_symbol__ON_PROPERTYerror] (angular2-indexeddb.ts:23)
at IDBOpenDBRequest.wrapFn (zone.js:1166)
at ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:4740)
at ZoneDelegate.invokeTask (zone.js:420)
at Zone.runTask (zone.js:188)
at ZoneTask.invokeTask [as invoke] (zone.js:496)
at invokeTask (zone.js:1517)
If I missunderstood something please close this Issue and let me know, how to do it correct.
Hello,
I am struggling with scenario where I already have populated DB and I want to get data from it.
Let's say scenario looks like this:
Could you show me how can I fetch existing data?
I just updated my project from angular 4 to 5 an noticed, that the plugin is not working anymore.
I generated a new Angular Project and just added the import and let db = new AngularIndexedDB('myDb', 1);
to the constrcutor of the App Component.
ERROR in ./node_modules/angular2-indexeddb/index.ts
Module build failed: Error: [...]\node_modules\angular2-indexeddb\index.ts is not part of the compilation output. Please check the other error messages for details.
at AngularCompilerPlugin.getCompiledFile ([...]\node_modules@ngtools\webpack src\angular_compiler_plugin.js:625:23)
at plugin.done.then ([...]\node_modules@ngtools\webpack\src\loader.js:467:39)
at process._tickCallback (internal/process/next_tick.js:109:7)
@ ./src/app/_services/database.service.ts 11:0-54
@ ./src/app/_services/index.ts
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts
I use the following dependencies:
"@ angular/cli": "1.5.4",
"@ angular/compiler-cli": "^5.0.0",
"@ angular/language-service": "^5.0.0",
"@ types/jasmine": "~2.5.53",
"@ types/jasminewd2": "~2.0.2",
"@ types/node": "~6.0.60",
"codelyzer": "^4.0.1",
"jasmine-core": "~2.6.2",
"jasmine-spec-reporter": "~4.1.0",
"karma": "~1.7.0",
"karma-chrome-launcher": "~2.1.1",
"karma-cli": "~1.0.1",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~3.2.0",
"tslint": "~5.7.0",
"typescript": "~2.4.2"
Hi there
Short question: Is this lib ready for production use (with AoT) and is Angular 4 supported?
Thx
have error for build app. ng build --prod
.
I have Angular4. How fixed it?
ERROR in Error encountered resolving symbol values statically. Calling function 'makeDecorator', function calls are not
supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol Injectab
le in F:/Projects/crew/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/metadata.d.ts, resolving symbol
OpaqueToken in F:/Projects/crew/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/opaque_token.d.ts, re
solving symbol OpaqueToken in F:/Projects/crew/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/opaque_
token.d.ts
Getting following error on ie 11 but same is working on chrome as well as firefox
ERROR Error: Uncaught (in promise): TypeError: Unable to get property 'open' of undefined or null reference
TypeError: Unable to get property 'open' of undefined or null reference
at Anonymous function (http://localhost:4200/vendor.bundle.js:99486:13)
at ZoneAwarePromise (http://localhost:4200/polyfills.bundle.js:14503:29)
at AngularIndexedDB.prototype.createStore (http://localhost:4200/vendor.bundle.js:99484:26)
at LocalStorageService.prototype.createStores (http://localhost:4200/main.bundle.js:112:9)
at AppComponent.prototype.ngOnInit (http://localhost:4200/main.bundle.js:7721:9)
at checkAndUpdateDirectiveInline (http://localhost:4200/vendor.bundle.js:11174:9)
at checkAndUpdateNodeInline (http://localhost:4200/vendor.bundle.js:12596:13)
at checkAndUpdateNode (http://localhost:4200/vendor.bundle.js:12536:9)
at prodCheckAndUpdateNode (http://localhost:4200/vendor.bundle.js:13063:5)
at Anonymous function (Function code:12:5)
"ERROR"
{
[functions]: ,
proto: { },
description: "Uncaught (in promise): TypeError: Unable to get property 'open' of undefined or null reference
TypeError: Unable to get property 'open' of undefined or null reference
at Anonymous function (http://localhost:4200/vendor.bundle.js:99486:13)
at ZoneAwarePromise (http://localhost:4200/polyfills.bundle.js:14503:29)
at AngularIndexedDB.prototype.createStore (http://localhost:4200/vendor.bundle.js:99484:26)
at LocalStorageService.prototype.createStores (http://localhost:4200/main.bundle.js:112:9)
at AppComponent.prototype.ngOnInit (http://localhost:4200/main.bundle.js:7721:9)
at checkAndUpdateDirectiveInline (http://localhost:4200/vendor.bundle.js:11174:9)
at checkAndUpdateNodeInline (http://localhost:4200/vendor.bundle.js:12596:13)
at checkAndUpdateNode (http://localhost:4200/vendor.bundle.js:12536:9)
at prodCheckAndUpdateNode (http://localhost:4200/vendor.bundle.js:13063:5)
at Anonymous function (Function code:12:5)",
message: "Uncaught (in promise): TypeError: Unable to get property 'open' of undefined or null reference
TypeError: Unable to get property 'open' of undefined or null reference
at Anonymous function (http://localhost:4200/vendor.bundle.js:99486:13)
at ZoneAwarePromise (http://localhost:4200/polyfills.bundle.js:14503:29)
at AngularIndexedDB.prototype.createStore (http://localhost:4200/vendor.bundle.js:99484:26)
at LocalStorageService.prototype.createStores (http://localhost:4200/main.bundle.js:112:9)
at AppComponent.prototype.ngOnInit (http://localhost:4200/main.bundle.js:7721:9)
at checkAndUpdateDirectiveInline (http://localhost:4200/vendor.bundle.js:11174:9)
at checkAndUpdateNodeInline (http://localhost:4200/vendor.bundle.js:12596:13)
at checkAndUpdateNode (http://localhost:4200/vendor.bundle.js:12536:9)
at prodCheckAndUpdateNode (http://localhost:4200/vendor.bundle.js:13063:5)
at Anonymous function (Function code:12:5)",
name: "Error",
promise: { },
rejection: { },
stack: "Error: Uncaught (in promise): TypeError: Unable to get property 'open' of undefined or null reference
TypeError: Unable to get property 'open' of undefined or null reference
at Anonymous function (http://localhost:4200/vendor.bundle.js:99486:13)
at ZoneAwarePromise (http://localhost:4200/polyfills.bundle.js:14503:29)
at AngularIndexedDB.prototype.createStore (http://localhost:4200/vendor.bundle.js:99484:26)
at LocalStorageService.prototype.createStores (http://localhost:4200/main.bundle.js:112:9)
at AppComponent.prototype.ngOnInit (http://localhost:4200/main.bundle.js:7721:9)
at checkAndUpdateDirectiveInline (http://localhost:4200/vendor.bundle.js:11174:9)
at checkAndUpdateNodeInline (http://localhost:4200/vendor.bundle.js:12596:13)
at checkAndUpdateNode (http://localhost:4200/vendor.bundle.js:12536:9)
at prodCheckAndUpdateNode (http://localhost:4200/vendor.bundle.js:13063:5)
at Anonymous function (Function code:12:5)
at resolvePromise (http://localhost:4200/polyfills.bundle.j",
Symbol()_m.ysmet5j9mui: undefined,
Symbol()_n.ysmet5j9mui: undefined,
Symbol(rxSubscriber)_o.ysmet5j9mui: undefined,
task: { },
zone: { }
}
The es6-promise folder in @types folder in node modules created by you package is creating duplicate identifier issues. If we remove it ,then i get "cannot resolve all paramters for AngularIndexedDb" in metadata resolver while running the application.
Hi.
I am try import AngularIndexedDB but not works. I am use 0.0.3 version.
The error 'Cannot find module 'angular2-indexeddb'.'
Thank you
Blob is failing to save using angular2-indexeddb.
Code sample:
` // create blob:
const aFileParts = ['foo!'];
const oMyBlob = new Blob(aFileParts, {type : 'text/html'});
console.log('blob type' + oMyBlob.type); // outputs as 'text/html'
// initialize my indexeddb store:
return this.initializeStores().then(() => {
// add 'oMyBlob' to the FileData data store:
return this.db.add('FileData',
{ FileName: 'foo', FileData: oMyBlob, FileType: 'audio' }).then(() => {
// Success
console.log('added ' + 'foo' + ' to FileData store.');
// Get the file from the FileData store
return this.db.getByIndex('FileData', 'FileName', 'foo').then((record) => {
return Promise.resolve();
});
}, (error) => {
console.log(error);
this.handleError(error)
return Promise.reject(error);
});
}, (error) => {
this.handleError(error);
return Promise.reject(error);
});`
When i look inside the store the field for the blob is 'null'. This works when i use indexeddb without the angular module.
Is this a known issue? i like using this module, but this issue is a deal breaker for me. I'm hoping there is a workaround.
getALL method currently fetch all records from Objectstore, need a features to set the offset and number of iteration or records needed
Hi, how to use "db.getAll" in ngOnInit()?
My code:
import {Component, OnInit} from '@angular/core';
import {AngularIndexedDB} from 'angular2-indexeddb';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
new_item: String = '';
data: any[] = [];
db: any = null;
indexedDB: any = window.indexedDB;
constructor() {
this.db = new AngularIndexedDB('MyDb', 1);
this.db.openDatabase(1, (evt) => {
evt.currentTarget.result.createObjectStore(
'item', { keyPath: 'id', autoIncrement: true });
});
}
ngOnInit(): void {
// This error "You need to use the createStore function to create a database before you query it!]"
this.db.getAll('item').then((item) => {
console.log(item);
}, (error) => {
console.log(error);
});
}
addItem(): void {
this.db.add('item', { text: this.new_item }).then((evt) => {
this.data.push({text: this.new_item, id: evt.key});
this.new_item = '';
}, (error) => {
console.log(error);
});
}
deleteItem(id: number): void {
console.log(id);
this.db.delete('item', id).then(() => {
this.data = this.data.filter( item => (item.id !== id));
}, (error) => {
console.log(error);
});
}
}
`
Reference #32
same issue when upgraded angular to 5.0.0-beta.7
build command :- ng build --prod
this warning only comes when trying to make production build
Hi. I have a error when import js into my index.html
Uncaught ReferenceError: exports is not defined
at angular2-indexeddb.ts:11
My versions:
"@angular/...": "^2.4.0"
"typescript": "~2.0.0"
Can you help me please?
Thanks!
It would be nice to embrace angular DI design choice by making AngularIndexedDB service injectable through OpaqueToken. as it is right now, it requires client code to manually instantiate the service by providing store name and version code.
I am getting this error
You need to use the createStore function to create a database before you query it!
in the constructor i am calling createStore. I call listOrgs
function from Component. When i reload the browser i get the above error.
Not able to figure out how to fix it.
Please help.
I get this two errors:
default] /Users/calderon/gdrive/smilodon/projects/angular2-cli/lungo5/node_modules/angular2-indexeddb/angular2-indexeddb.ts:76:59
Cannot find name 'IDBCursorDirection'.
[default] /Users/calderon/gdrive/smilodon/projects/angular2-cli/lungo5/node_modules/angular2-indexeddb/angular2-indexeddb.ts:281:61
Cannot find name 'IDBTransactionMode'.
[default] Checking finished with 2 errors
My versions:
@angular/cli: 1.4.4
node: 6.10.3
os: darwin x64
angular/common: 2.0.0
angular/compiler: 2.0.0
angular/core: 2.0.0
angular/forms: 2.0.0
angular/http: 2.0.0
angular/platform-browser: 2.0.0
angular/platform-browser-dynamic: 2.0.0
angular/router: 3.0.0
ngtools/webpack: 1.1.8
typescript: 2.4.2
Thanks
I implemented this service in a small project of mine which was build using angular-cli (beta 24). The problem I encounter is tat I'm not able to build the project using the AOT parameter due to this error:
ERROR in Error encountered resolving symbol values statically. Calling function 'makeParamDecorator', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol Injectable in <PROJECT_PATH>/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/metadata.d.ts, resolving symbol OpaqueToken in <PROJECT_PATH>/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/opaque_token.d.ts, resolving symbol OpaqueToken in <PROJECT_PATH>/node_modules/angular2-indexeddb/node_modules/@angular/core/src/di/opaque_token.d.ts
ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '<PROJECT_PATH>/src'
@ ./src/main.ts 5:0-74
@ multi main
ERROR in ./~/@angular/core/src/linker/system_js_ng_module_factory_loader.js
Module not found: Error: Can't resolve '<PROJECT_PATH>/src/$$_gendir' in '<PROJECT_PATH>/node_modules/@angular/core/src/linker'
@ ./~/@angular/core/src/linker/system_js_ng_module_factory_loader.js 69:15-36 85:15-102
@ ./~/@angular/core/src/linker.js
@ ./~/@angular/core/src/core.js
@ ./~/@angular/core/index.js
@ ./src/main.ts
@ multi main
This blog helped me in making another library AOT ready:
https://medium.com/@isaacplmann/getting-your-angular-2-library-ready-for-aot-90d1347bcad#.it1dbfyro
I just can’t get the add to work in edge.
Do you have working code I can look at.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.