我想查找 Angular 4 文档 (https://angular.io/docs) 的本地/离线版本， 不幸的是，我可以在离线环境中使用（根本无法访问互联网，热忱及其替代品）无法使用。
经过数小时的搜索，似乎没有人能找到一个简单的解决方案，仅适用于 angularJS 1.0 版本..
我还尝试克隆angular documentation project，但没有成功在没有互联网的情况下在本地运行它。
【问题讨论】：
【讨论】：
对于那些不知道什么是热心的人？ 语言和框架文档的离线桌面应用程序 您可以从以下链接下载 zeal 桌面应用程序：
https://zealdocs.org/download.html
它可以离线工作！你可以下载任何你想在离线模式下访问它的东西
【讨论】：
如果您使用angular-cli，您可以使用 ng build 构建一个 Angular 4 项目。在您的“dist”目录中，您拥有所需的所有文件。
如果您在导航器中打开“index.html”，您可以执行该项目。如果您有 IIE 服务器，则可以创建一个空网站
重要提示：如果您不使用服务器，则在执行 ng build --prod 后，您必须编辑 de index.html 并更改“base”并关闭标记脚本（您也可以更改 .js 的名称）
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>AppNew</title>
<base href="/Users/Usuario/Documents/app-new/dist/">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="styles.css" rel="stylesheet"/>
</head>
<body>
<app-root/>
<script type="text/javascript" src="inline.js"></script>
<script type="text/javascript" src="polyfills.js"></script>
<script type="text/javascript" src="vendor.js"></script>
<script type="text/javascript" src="main.js"></script>
</body>
</html>
【讨论】：
//app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HashLocationStrategy,LocationStrategy,CommonModule } from '@angular/common';
import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { WellcomeComponent } from './wellcome/wellcome.component';
const appRoutes: Routes = [
{ path: '', component: HomeComponent },
{ path: 'wellcome', component: WellcomeComponent },
{path: '**', redirectTo: '', pathMatch: 'full' }
]
@NgModule({
declarations: [
AppComponent,
HomeComponent,
WellcomeComponent
],
imports: [
BrowserModule,
CommonModule,
RouterModule.forRoot(appRoutes)
],
providers: [
{ provide: LocationStrategy, useClass: HashLocationStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule { }
app.component.ts
//app.component.ts
import { Component } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
@Component({
selector: 'app-root',
template:`
<div style="text-align:center">
<p>
<a [routerLink]="['/']">Home</a>
</p>
<p>
<a [routerLink]="['/wellcome']">Wellcome</a>
</p>
<h1>
Welcome to {{title}}!
</h1>
</div>
<h2>Here are router-outlet: </h2>
<router-outlet></router-outlet>`,
})
export class AppComponent {
title = 'app';
}
wellcome.component.ts
//wellcome.component.ts
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-wellcome',
template:`
<p>
wellcome works!
</p>
`
})
export class WellcomeComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
home.component.ts
//home.component.ts
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-home',
template:`
<p>
home works!
</p>
`
})
export class HomeComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
在您完成构建 --prod 之后，您必须编辑 index.html 替换为 document.write("")
Index.html 会像
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>AppNew</title>
<script>document.write("<base href='"+window.location.href+"'/>") </script>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="styles.d41d8cd98f00b204e980.bundle.css" rel="stylesheet"/>
</head>
<body>
<app-root/>
<script type="text/javascript" src="inline.2833f8af5a9f1ba869e4.bundle.js"/>
<script type="text/javascript" src="polyfills.8eba0ab53b5457105d75.bundle.js"/>
<script type="text/javascript" src="vendor.aeea1adcdc349547d6f1.bundle.js"/>
<script type="text/javascript" src="main.c39d8a271dce22bb4c5c.bundle.js"/>
</body>
</html>
【讨论】：
这个方法有点棘手，但很有效。您只需要谷歌浏览器下载angular.io网站的离线版本。步骤如下：
您的angular.io 离线版本在桌面上。断开互联网后尝试。
注意：如果您在第 3 步之前还没有打开所有页面。没有问题。重新连接到互联网并在桌面上添加的快捷方式中打开所有这些链接。
【讨论】：