Question

我正在开发一款Ionic App，它也将在浏览器上作为网络应用运行。

在html中，我有以下代码：

<ion-header>
  <ion-navbar>
    <ion-title>Login</ion-title>
  </ion-navbar>
</ion-header>

我认为离子标题标签足以改变浏览器标签上的标题，但似乎并非如此。它仍然是＃Ionic App＆＃34;。我怎样才能改变它？

由于

Answer 1

检查您的＆＃34; index.html＆＃34; src文件夹中的文件。你会看到＆＃34;标题＆＃34; html标签。在那里改变它会反映出来。

Answer 2

Ionic 5兼容解决方案

import { Title } from '@angular/platform-browser';

...

export class MyPage {

    constructor(private titleService: Title) {

        this.titleService.setTitle('Title');
    }
}

Answer 3

离子5 + 反应的解决方案：

最有可能您正在处理/src/中的文件，而编译后的文件会进入www/。

您可能想知道为什么/src/index.html或/src/manifest.json不存在，或者如果手动创建，为什么它们不起作用。

只需查看/public/即可找到您的资产（应用图标和Web / PWA的Favicon）以及index.html和manifest.json的蓝图。

/public/index.html看起来像这样：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Ionic App</title>

    <base href="/" />

    <meta
      name="viewport"
      content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
    />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

    <link rel="shortcut icon" type="image/png" href="%PUBLIC_URL%/assets/icon/favicon.png" />

    <!-- add to homescreen for ios -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-title" content="Ionic App" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  </head>

  <body>
    <div id="root"></div>
  </body>

</html>

我希望Ionic可以考虑您在/ionic.config.json中输入了哪个应用名称，但是正如您所看到的，它被硬编码为“ Ionic App”。

在浏览器中为Ionic应用程序设置标题

3 个答案: