Angular 4文档离线计算机[关闭]

Question

我想找到一个本地/离线版本的Angular 4文档（https://angular.io/docs），我可以在离线环境中使用（根本没有互联网访问，热心和它的替代品）不能不幸地使用。

经过几个小时的搜索后，似乎没有人能找到一个简单的解决方案来完成这项任务，仅适用于angularJS 1.0版本。

我也尝试克隆angular documentation project没有成功，在没有互联网可用的情况下在本地运行它。

Answer 1

首先访问DevDocs.io这个网站
然后从菜单转到Preference
检查要列入的项目，然后单击Apply
然后从菜单中转到Offline并安装所有要在离线状态下查看的文档。
就这样！！！现在你甚至可以在离线状态下看到它。

Answer 2

转到所需页面并在工具部分打印或按ctrl + p并将其另存为pdf

Answer 3

对于那些不知道热情是什么的人？语言和框架文档的离线桌面应用程序您可以通过以下链接dwonload zeal桌面应用程序：

https://zealdocs.org/download.html

它离线工作！您可以在离线模式下载任何想要访问它的内容

Answer 4

如果你使用angular-cli，你可以使用ng build构建一个角度4项目。在“dist”目录中，您可以获得所需的所有文件。

如果在导航器中打开“index.html”，则可以执行该项目。如果您有IIE服务器，则可以创建一个空网站

重要提示：如果您不使用服务器，在执行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>

Answer 5

//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>

Answer 6

这种方法有点棘手，但它有效。您只需要谷歌浏览器浏览器下载angular.io网站的离线版本。步骤如下：

在chrome浏览器中打开angular.io。
打开所有页面至少一次您想要离线阅读。页面将缓存在浏览器中。
现在转到更多工具>添加到桌面，然后单击添加。

您的离线版angular.io在桌面上。断开互联网连接后尝试一下。

注意：如果在步骤3之前尚未打开所有页面，则没有问题。重新连接到Internet并在桌面上添加的快捷方式中打开所有这些链接。

Angular 4文档离线计算机[关闭]

问题描述投票：7回答：6

6个回答

最新问题

Angular 4文档离线计算机[关闭]

问题描述 投票：7回答：6

6个回答

最新问题

问题描述投票：7回答：6