我正在使用angular4中的bootstrap进行编码,但显示错误: 错误是底部div登录中颜色为白色的部分:
登录代码:/ login
时显示<div class="row" style="background-image: url(../assets/img/test.jpg)">
<div style="background-color: rgba(255, 0, 0, 0.6);">
<nav class="container navbar">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#" style="color: #FFFFFF">test</a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-dashboard"></i>
<p >Dashboard</p>
</a>
</li>
<li>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-sign-in"></i>
<p >Login</p>
</a>
</li>
<li>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-user-plus"></i>
<p >Register</p>
</a>
</li>
<li>
<a (click)='logout()'>
<p>Log out</p>
</a>
</li>
<li class="separator hidden-lg hidden-md"></li>
</ul>
</div>
</div>
</nav>
<div class="container card col-md-4 col-sm-6 col-xs-8 col-xs-offset-2 col-md-offset-4 col-sm-offset-3">
<div class="header text-center"><h3>Login</h3></div>
<form novalidate class="form-horizontal" #fo='ngForm' (submit)="mySubmit(fo)" >
<div class="form-group">
<label class="control-label col-sm-2" for="email">Email :</label><br>
<div class="col-sm-12">
<input type="email" class="form-control" name="email" placeholder="Enter email" [(ngModel)]="data.email" #dataemail="ngModel" required minlength="12" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$">
</div>
<div *ngIf="dataemail.errors?.required && dataemail.touched" class="alert alert-danger">Email is required</div>
<div *ngIf="dataemail.errors?.minlength && dataemail.touched" class="alert alert-danger">
nead at least 12 chars </div>
<div *ngIf="dataemail.errors?.pattern" class="alert alert-danger">
Email is invalid
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="password">Password :</label><br>
<div class="col-sm-12">
<input type="password" class="form-control" name="password" placeholder="Enter Password" [(ngModel)]="data.password" #datapassword="ngModel" required minlength="8">
</div>
<div *ngIf="datapassword.errors?.required && datapassword.touched" class="alert alert-danger">Password is required</div>
<div *ngIf="datapassword.errors?.minlength && datapassword.touched" class="alert alert-danger">
nead at least 8 chars </div>
</div>
<div class="form-group">
<div class="footer text-center">
<button class="btn btn-fill btn-danger btn-wd" type="submit">Login</button>
</div>
</div>
</form>
</div>
<footer class="container footer" >
<nav class="pull-right">
<ul>
<li>
<a href="#" >
Home
</a>
</li>
<li>
<a href="#" >
Company
</a>
</li>
<li>
<a href="#" >
Portfolio
</a>
</li>
<li>
<a href="#" >
Blog
</a>
</li>
</ul>
</nav>
</footer>
</div>
</div>
代码app.component.html:代码内容所有页面项目显示
<div class="wrapper" *ngIf="isLoggedIn else login">
<div class="sidebar" data-color="red" data-image="">
<app-sidebar></app-sidebar>
<div class="sidebar-background" style="background-image: url(/assets/img/sidebar-5.jpg)"></div>
</div>
<div class="main-panel">
<navbar-cmp ></navbar-cmp>
<router-outlet></router-outlet>
<div *ngIf="isMap('maps')">
<footer-cmp></footer-cmp>
</div>
</div>
</div>
<ng-template #login>
<router-outlet></router-outlet>
</ng-template>
错误仅在登录页面中,但在另一页面中我没有看到任何错误。