Angularjs Firebase doesnt work with IE and android browser

Question

My app works fine with Google Chrome (in android too), however when i try to open it throw IE or android browser, angular code crashes.

Who knows what is the reason for that??

Thanks in advance!

It get stuck at this line

var dbRef = firebase.database().ref().child('Categories/');
  dbRef.once('value', snap => {

    snap.forEach(function(childSnap) {

      $scope.allcats.push(childSnap.val());
      $scope.$apply();
    })

and following this:

image of in the console

Here is error shown in the console SCRIPT5022: [$injector:modulerr] http://errors.angularjs.org/1.6.6/$injector/modulerr?p0=app1&p1=Error%3A%20%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.6.6%2F%24injector%2Fnomod%3Fp0%3Dapp1%0A%20%20%20at%20Anonymous%20function%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A26%3A402)%0A%20%20%20at%20b%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A25%3A420)%0A%20%20%20at%20Anonymous%20function%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A26%3A175)%0A%20%20%20at%20Anonymous%20function%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A42%3A288)%0A%20%20%20at%20p%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A8%3A5)%0A%20%20%20at%20g%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A42%3A138)%0A%20%20%20at%20hb%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A46%3A244)%0A%20%20%20at%20c%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A22%3A17)%0A%20%20%20at%20Uc%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fangular.min.js%3A22%3A325)%0A%2

When it work in Chrome and doesnt work in IE, maybe there's some code that doesn't support in IE. That error message shows links to angular that has message Failed to instantiate module app1 due to: . Maybe you can show some of your code for suspect in creating this error. — egon12

egon12 egon12 · Accepted Answer · 2017-10-29T14:34:51

Internet Explorer doesnt support arrow function, so try to change

dbRef.once('value', snap => {

to

dbRef.once('value', function(snap) {

update:

Also there something that you must change. When you use arrow function, this will refer to what you ussualy think to (ex: the Class, the Controller or something). But when you use unnamed function this keyword will refer to the function itself.

ex:

this.b = 1
a.onChange( e => {
    console.log(this.b) // works
}

but this won't work

this.b = 1
a.onChange( function(e) {
    console.log(this.b) // will be undefined
}

to solve this problem you need to create variable that refer to this.

ex:

this.b = 1
var self = this
a.onChange( function(e) {
    console.log(self.b)
}

Angularjs Firebase doesnt work with IE and android browser

1 Answers