Angular-2: Ändern Sie das Favicon-Symbol gemäß der Konfiguration

Question

Oct 04, 2016, 07:56 AM

Angular-2: Ändern Sie das Favicon-Symbol gemäß der Konfiguration

Ich rendere eine dynamische Seite, ein dynamisches Menü und andere Elemente in meiner Anwendung. Ich möchte auch das Favicon ändern, wie vom Administrator konfiguriert.

Sag zum Beispiel, wenn wenn meinpage load konfiguriertes Favicon istxyz.png dann wird es zeigenxyz.png als das Favicon.

Wie in der Abbildung unten sollte ein neues Favicon ein vorhandenes in der Nähe von "Test Application" ersetzen. Derzeit wird das Standard-Favicon angezeigt (siehe unten).

index.html:

<!DOCTYPE html>
<html>
<head>
    <base href="/MyFirstAngular2/" >
    <title>Angular 2</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" id="appIcon" href="/favicon.ico" type="image/x-icon" />
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet" />
    <link href="css/Site.css" rel="stylesheet" />

    <script src="scripts/jquery-2.2.1.min.js"></script>
    <script src="scripts/bootstrap.min.js"></script>
    <script src="scripts/main/shim.min.js"></script>
    <script src="scripts/main/zone.js"></script>
    <script src="scripts/main/reflect-metadata.js"></script>
    <script src="scripts/main/system.src.js"></script>
    <script src="scripts/system.config.js"></script>
    <script>

        document.SYSTEMJS_CONFIG.map.app = 'scripts/configs';

        document.SYSTEMJS_CONFIG.packages.app = { main: 'application.ts', defaultExtension: 'ts' };

        System.config(document.SYSTEMJS_CONFIG);

        System.import('app').catch(function (err) {
            console.error(err);
        });        
    </script>

</head>
<body>
        <application></application>
</body>
</html>

Ich erhalte ein neues Favicon bei jeder Komponentenauslastung, daher müssen Sie bei jedem Komponentenaufruf nur das Favicon-Symbol ändern.