Use the Cordova plugin in Angular 2 + Cordova app

Question

I have an Angular 2 application that I compile into a cordova and deploy to Android / IOS. I DO NOT use ionic, I have seen a number of solutions that use ionic, but I can not convert this entire project to ionic.

Everything is working fine so far, but I can't figure out how to use cordova plugins. In particular, I am trying to use "cordova-plugin-file" to store local files on the device.

I can not understand how to import / access files or functions of the plugin? Maybe something is missing when cordova plugins work. Most tutorials show that you can use, for example, one of the added functions of the plugin.

window.requestFileSystem(window.TEMPORARY, 5 * 1024 * 1024, function (fs) {
   console.log('file system open: ' + fs.name);
   createFile(fs.root, "newTempFile.txt", false);
}, onErrorLoadFs);

However, the above code breaks Angular 2, and I get such errors.

 Property 'requestFileSystem' does not exist on type 'Window'.

It is pretty obvious that something is not getting the import or is being read correctly. Most likely, because cordova is a subfolder of the Angular 2 application. And I run ng build and put the output files in the Cordova folder, so at that time he did not know about Cordova?

 Angular_2_project
 ├── cordova
 │   └── plugins
 ├── src
 │   └── index.html
 │   └── app
 │        └── html/ts files 

Answer 1

It seems that cordova.js is not loaded.

Add related cordova.js and related .js plugins

If it angular-cli.json just loads them in scripts.

Also, when you add it to your * .ts files, it will throw an error, and trans when u will try to build it. To avoid this, add it in the declaration at the top of your * .ts file.

: cordova.on ts.

declare var cordova:any