我有一个Angular2项目,index.html
中包含头部栏。其他组件将负责登录和显示其他内容。
如果用户已登录,我需要在头部栏中显示一个标志,该标志仅存在于index.html
中。 如果用户已登录,我将在app.component.ts
中设置一个标记。 如何在index.html
中引用该标记?
<body>
<div class="content-body">
<header class="header">
<div class="header-bar container">
<div class="header-bar__main">
<div class="header-heading">
<h1 class="page-title">noHold Application</h1>
</div>
</div>
<a class="btn btn--small btn--icon ng-scope" title="Logout"><span class="icon-sign-out"></span></a> // this line should be displayed only if user logs in.
</div>
</header>
<div class="content">
<div class="content__main">
<div class="container">
<app-root>Loading... </app-root>
</div>
</div>
</div>
</div>
</body>
app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
static loggedIn = false;
getLoggedIn() {
return AppComponent.loggedIn;
}
}