【问题标题】：Static html pages with angular 6角度为 6 的静态 html 页面
【发布时间】：2019-03-19 21:32:29
【问题描述】：

问题

我有 4 个带有完整 angular 6 web 应用程序的静态页面，我想在启动时渲染 home.html 页面，并在登录后重定向到实际的 angular web 应用程序，从那里启动 angular 路由并发挥作用。问题是我为什么要这个？我想要这个是因为我的网络应用程序有一些静态页面，比如主页、联系我们、我想要条款和条件以及隐私政策等。我希望这些页面是静态的，以便爬虫友好，并且通过排除角度来快速渲染。

问题

我怎样才能做到这一点。

到此为止

我在 index.html 所在的根目录中创建了 3 个静态页面。我在 angular cli 中放了这一行

"index": "src/home.html",

但现在我无法导航到 contactus.html 页面，它显示了这个错误。

错误

"The selector "app-root" did not match any elements"

【问题讨论】：

stackoverflow.com/a/44625753/2134604

标签： html typescript angular6 angular-cli-v6

【解决方案1】：

如果我理解正确，您可以使用“路线”来映射您的页面，并轻松地显示在同一个“索引”中。用途广泛，因为有了它，你可以管理很多事情，比如会话访问：我给你看一个例子：

app.module.ts

import { Routes, RouterModule } from '@angular/router';
/*Example component*/
import { InicioComponent } from './inicio/inicio.component';
import{ ExamplePage } from './page1/examplePage.component';
/*Routes mapping*/
const routes: Routes = [
 {path: '', component: InicioComponent },
 {path: 'proveedores', component: ExamplePage, canActivate: [GuardService] }] /* Example of protected by session page*/
@NgModule({
declarations: [
ExamplePage,
InicioComponent
  ],
  imports: [
RouterModule.forRoot(routes)
]

app.component.html

    <h1>Angular</h1>
    <hr>
    <hr>
    <app-header></app-header>
    <div class="container text-center">
        <router-outlet>**Here are all the pages**</router-outlet>
    </div>

这只是一个简短的例子，很复杂，在这里做一个深入的解释，但是在 angular.io 中有很多关于这个模块的文档：https://angular.io/guide/router

【讨论】：