Angular 5 中的页眉和页脚 [英] Header and Footer in Angular 5

查看:33
本文介绍了Angular 5 中的页眉和页脚的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在 angular 5 中创建我的网站

I am creating my website in angular 5

我的网站中有主页、商店和类别作为页面

I have homepage, stores and categories as pages in my site

最初我决定在整个网站上保持页眉和页脚的全局性.

Initially I decided to keep header and footer as global across the website.

我的意思是创建一个页眉和页脚组件并将它们用作指令

I mean to create a header and footer components and use them as directives

<app-header></app-header>
<app-homepage></app-homepage>
<app-header></app-header>

<app-header></app-header>
<app-stores></app-stores>
<app-header></app-header>

<app-header></app-header>
<app-categories></app-categories>
<app-header></app-header>

我正在尝试使用页面的元信息,例如页面标题、数据库中的元关键字.

I am trying to use the meta information of the page, like page title, meta-keywords from my database.

对于主页是可能的.

对于商店和类别,我不太清楚如何使用页面标题、元关键字.

For stores and categories I am little confused how can I use the page title, meta-keywords.

例如:

`<html>
<title>{{ homepage.title }}</title>
<meta keywords = {{ homepage.meta_keywords }}>
</html>`

以上内容可用于主页.

但是对于商店和类别,它会根据页面而变化.

But for Stores and Categories it will change according to page.

需要一个关于如何根据页面更改标题和元关键字的解决方案

Need a solution on how I can change the title and meta keywords according to page

喜欢商店:

`<html>
<title>{{ storepage.title }}</title>
<meta keywords = {{ storepage.meta_keywords }}>
</html>`

推荐答案

这是我发现的工作:

https://github.com/angular/angular-cli/wiki/stories-universal-rendering

这篇关于Angular 5 中的页眉和页脚的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆