14

I found an issue with angular application. I have a the location provider setup to use the html5Mode true:

$locationProvider.html5Mode(true);

I noticed that the favicon is disappearing when navigating between pages. I'm using IE11 edge document mode.

Does anyone bumped into this too?

Thanks

Bill
  • 25,119
  • 8
  • 94
  • 125
Erab BO
  • 776
  • 4
  • 11
  • 24
  • 1
    Happens in Chrome as well, looks like a known bug with push state: https://code.google.com/p/chromium/issues/detail?id=50298. – Bill Apr 21 '14 at 06:12
  • Hi @Bill, I have a different results than those you described. First of all it's not happens on Chrome, then after reading the posts in the link you provided I found its more related to an anchor tag inside a page for a specific place in the same page - plus it appears to happen only in Mac. One last thing i found out that this is happens also in other website such as FB - the favicon disappears after navigating different pages. – Erab BO Apr 22 '14 at 10:51
  • 1
    If it happens on Facebook too, are the AngularJS tags relevant? – Steve Klösters Jul 06 '15 at 18:22
  • I am guessing here but try favicon.ico?def=abcdefghijklmn so it would not cache it? – eugenekgn Oct 21 '15 at 14:06

2 Answers2

1

Thought it might be worth adding my findings here...

At first I had the exact same problem, I couldn't get the favicon to stay on the page when changing from the root home page. I tried Shaun's answer and that didn't work either so I looked online a bit more and found that in all modern browsers you are able to use PNGs as your default favicon so I tried that and it worked for me in latest Chrome, latest Firefox and IE11 via localhost and then in Edge once I published to my webserver.

I hope this helps anyone else out that was having the same issue.

ChronixPsyc
  • 478
  • 1
  • 8
  • 22
-1

Not sure if this will work for you or not.

This code assumes you have jQuery as well as angularjs (not just jqlite). An equivalent in pure javascript would be possible (though longer).

angular.module('app', [])
.run(function ($rootScope, $location) {

  $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {

    // bug fix: reset favicon path
    var favType = "image/x-icon"
    favLink = $('link[type="' + favType + '"]').remove().attr("href");
    $('<link href="' + favLink + '" rel="shortcut icon" type="' + favType + '" />').appendTo('head');

  })

});
Shaun
  • 933
  • 9
  • 16