favicon not working in angular application

Question

This is below code which is for a custom favicon

 <link rel="shortcut icon" sizes="16x16" href="favicon-16x16.png" type="image/png" />

in angular.cli

"assets": [
        "assets",
        "favicon-16x16.png"
      ],

• It's working for this URL(main menu) : http://localhost:4200/maintenance

• But it's not working for this URL(Sub Menu): http://localhost:4200/maintenance/colors

EDIT:

Also it's not working with full favicon URL href="../src/favicon-16x16.png"

Folder structure :

I have tried with putting all type of URL's from my old question : Different between ./ , ../ , ../../ , ~/ on file path(URL) in asp.net

But it doesn't help me.

Answer 1

According to what you are saying, it is working on "main menu" and not on "sub menu", it looks like your main src folder is called "/maintenance". So you should try using it as your base root.

try :

<link rel="shortcut icon" sizes="16x16" href="/maintenance/favicon-16x16.png" type="image/png" />