Extends typescript library with javascript Extends typescript library with javascript typescript typescript

Extends typescript library with javascript


You can see in the source https://github.com/robertomlsoares/leaflet-offline/blob/master/src/TileLayer.Offline.js

that you fail at:

    var resultPromise = this._tilesDb.getItem(dbStorageKey).then(function (data) {

So the call to

_tilesDb.getItem(dbStorageKey)

is returning null, at which point the code tries to call 'then' on null.

Since the tilesDB is something that you are supposed to be providing yourself, you can put a breakpoint in your getItem function to see what is going on. At some point you are returning null from your getItem function.

What getItem is supposed to do:

// return Promise that has the image Blob/File/Stream.

The key supplied to getItem is the url you supplied with a regex substitution applied to it (see _getStorageKey in same source file)


Cannot read property 'then' of null

Typescript gives this error when then receives null from the function it's applied on. So check that you are not missing return statement if your function is custom.

Now instead of adding layer to map directly at the time of say initialization.for that try to replace your existing code with

const offlineLayer = leaflet.tileLayer.offline('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', tilesDb, {    attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',    subdomains: 'abc',    minZoom: 13,    maxZoom: 19,    crossOrigin: true});offlineLayer.addTo(this.map)

check the reference of the map either this.map or whatever the refernce in your code.