Giter VIP home page Giter VIP logo

angular2-indexeddb's People

Contributors

cl3r1k avatar danny95djb avatar delian avatar galexmes avatar gilf avatar invition avatar marlon360 avatar spikalev avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

angular2-indexeddb's Issues

Error while Build

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

Error during build AOT - Using Angular 4

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 with mandatory primitive type constructor parameters

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?

Angular 5 Can't resolve all parameters for AngularIndexedDB

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"

Any way to get All by index value?

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!!

ts file compilation issue

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.

Having trouble to insert new value.

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 2?

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.

How can I get callback result of inserted unique (keypath) id value?

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?

Method "remove" removed ...

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!

Edge not allowing add method

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.

Drop the database

How can I drop the database schema, in this case the object store? I want to recreate each time the object store.

[Feature Request] order by index and iterate over object ascending or descending order

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);
        };`

Error in initializing it.

client?cd17:80 .//angular2-indexeddb/angular2-indexeddb.ts
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;
@ ./
/angular2-indexeddb/index.ts 1:0-37
@ ./src/app/app.module.ts
@ ./src/main.browser.ts
@ multi app

memory crash inserting > 200.000 items

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?

You need to use the createStore function to create a database before you query it!

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.
/**

  • Created by bimal on 12/6/16.
    */
    import {Injectable} from '@angular/core';
    import {product} from './product'
    import {AngularIndexedDB} from "angular2-indexeddb";

@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]);
     }

 }

}

Error While Loading the Application

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.

Issues with get functions

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:

  • Create a new IndexedDB
  • Add entry
  • Remove entry
  • Display all entries through the function "Cursor"

Nevertheless the other functions doesn't seem to work as they all return "undefined"

  • getAll
  • getByIndex
  • getByKey

I have copied exactly the samples you described (nevertheless I might be doing something wrong)

Thanks in advance for your answer.

Regards,
Ben

how to return users from database to be able to use them in the code

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

README.md may not be up to date

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;

  • The 'result' property does not exist on the 'EventTarget' type.

Error on fetch for angular2-indexeddb.js

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)

How do i create multiple stores??

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??

add record Promise do not have key set.

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.

objectStore does not exists

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

Can't resolve all parameters for AngularIndexedDB

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 ?

Build Error

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'.

indexdb callback already returned.

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); 
                    });

how use component?

I right understood? I will install indexeddb and install angular2-indexeddb? If right, How install indexeddb?

Problems with the upgrade process

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:

  • When I already have a Version 3 Database in my browser nothing happens.
  • When I already have a Version 2 Database "version 3" would be printed.
  • When I have no database or a Version 1 Database "version 2" and "version 3" will be printed"

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.

[question] Fetch data from existing DB

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:

  • login to app
  • click button Create DB which creates and populates DB <- this works fine in latest Chrome and Angular 4.4.4
  • logout from app
  • login again
  • fetch & display exising data

Could you show me how can I fetch existing data?

"Module build failed" withAngular 5

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"

Calling function 'makeDecorator', function calls are not supported

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

Not working on IE 11

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: { }
}

duplicate identifier issue

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.

Import {AngularIndexedDB} from 'angular2-indexeddb' Not Works

Hi.

I am try import AngularIndexedDB but not works. I am use 0.0.3 version.

  1. Download from npm: npm install angular2-indexeddb
  2. Include angular2-indexeddb.js in my application.
  3. I am try import AngularIndexedDB but not works. :(

The error 'Cannot find module 'angular2-indexeddb'.'

Thank you

Blob type failing to save in Safari 10.1.2

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.

How to use "db.getAll" in ngOnInit()?

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);
    });

  }
  
}

`

Uncaught ReferenceError: exports is not defined

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!

Error: use the createStore function to create a database

I am getting this error

You need to use the createStore function to create a database before you query it!

my service

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.

Cannot find name 'IDBCursorDirection'

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

AOT support

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

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.