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.